Gehe zur übergeordneten Route in Angular 2

Nehmen wir an, ich habe eine Komponente, die ein Ding erstellt oder bearbeitet.Gehe zur übergeordneten Route in Angular 2

Die URL für die Schöpfung ist /things/create und die URL für Ausgabe ist /things/edit/4. Diese Routen haben denselben Elternteil.

Sobald ich das Formular ausfülle, rufe ich einige Webservice und dann gehe ich zurück zu meinem vorherigen Zustand, der /things war.

Wie kann ich angular sagen, um zur übergeordneten Route zurückzukehren?

Ich könnte this.router.navigate(['../'], {relativeTo : this.route}); verwenden, aber ['../'] würde nur für /things/create funktionieren. Für /things/edit/4 würde es zurückgehen auf /thing/edit, die nicht existiert.

Diese Komponente wird an zwei verschiedenen Orten verwendet, von denen eine einen zusätzlichen Schritt vor der Erstellung hat, so dass ich back() nicht verwenden kann.

Quelle

2017-03-08 MrVoodoo

können Sie nicht explizit sagen router.navigate ['/ dings']? –

Entschuldigung, das habe ich nicht erwähnt. Diese Komponente würde an zwei verschiedenen Orten verwendet werden. – MrVoodoo

Wie wäre es mit back() { this._location.back(); } –

können Sie verwenden

this.router.navigate['/things']

Quelle

2017-03-08 22:37:09

Sie können sehr viel für die Qualität Ihres Posts tun oder wie das funktioniert. In diesem Zusammenhang möchte ich den Pfad der Routen näher ausführen, da der Fragesteller den Pfad nicht zu verstehen scheint. –

Logic basiert auf der aktuellen URL

if(router.url.indexOf('create')>= 0){ 
    this.router.navigate(['../'], {relativeTo : this.route}); 
}else { 
    this.router.navigate(['../../'], {relativeTo : this.route}); 
}

so, wenn Ihre aktuelle URL-Pfad die erstellt wird, enthält Sie wissen, Sie müssen nur eine Ebene zurückgehen, sonst Sie gehen zwei Ebenen für die Bearbeitung zurück.

Verwenden Eingang Basis-URL

Ein anderer Ansatz zu bekommen könnte eine @Input für die Basis-URL zu haben sein, um zurück zu gehen. Daher muss jede Komponente, die Ihre Komponente initialisiert, die übergeordnete URL übergeben.

{ 
@Input 
parentUrl; 

this.router.navigate[parentUrl]; 
}

Quelle

2017-03-08 22:47:23

So sollten Sie für die ID der Sache in dem ActivatedRoute params überprüfen können, um den Kontext zu erhalten, wenn die Komponente erstellt oder eine Komponente bearbeiten. Wenn es einen param ['thingId'] gibt, dann gehe zu ../../ sonst gehe zu ../

Quelle

2017-03-08 22:52:22 Martin

Vielleicht ist diese Idee ein bisschen alt, aber ich bin sicher, dass es funktionieren wird und ziemlich einfach zu implementieren ist . Sie können den Abfrageparameter "Quelle" hinzufügen und zu "Quelle" navigieren, sobald die Operation abgeschlossen ist.

Quelle

2017-03-08 23:44:01

Gehe zur übergeordneten Route in Angular 2

Antwort

Verwandte Themen