Angular2: Wie Sie herausfinden, was war der Vorherige Seite-url verwendet angular2 routing

Ich bin die Entwicklung einer angular2 app und ich nutze den router.
Ich bin in eine Seite /myapp/signup. nach der Anmeldung navigiere ich durch die Verwendung /Anwendung/login. /myapp/Anmeldung kann auch navigiert werden von meiner home-Seite /Anwendung. So, jetzt, wenn der Benutzer die Benutzer /myapp/login ich wieder gehen. Dies kann durch den Einsatz von location.zurück(). Ich möchte aber nicht zurück, wenn der Benutzer aus /myapp/signup. Also ich sollte überprüfen, ob der Benutzer aus /myapp/signup und wenn dem so ist, möchte ich direkt woanders hin.
Wie kann ich wissen, dass die vorherigen url, damit ich die Benutzer anweisen, zu einem bestimmten Staat auf der Grundlage, dass ?

InformationsquelleAutor user3205675 | 2016-02-08

  1. 23

    Den pairwise Bediener ermöglicht, um die aktuelle zusammen mit dem vorherigen Wert

    update  

    import 'rxjs/add/operator/pairwise';
import 'rxjs/add/operator/filter';
import { Router, NavigationEnd } from '@angular/router';

export class AppComponent {
    constructor(private router: Router) {
        this.router.events
        .filter(e => e instanceof NavigationEnd)
        .pairwise().subscribe((e) => {
            console.log(e);
        });
    }
}

    Siehe auch Wie zu erkennen, eine route zu ändern, in Winkel?

    original (super alt)

    Injizieren Router abonnieren und Ereignisse und bewahren Sie diese für spätere Referenz

    constructor(private _router: Router) {
  this._router.subscribe(route => {
    this.nextRoute ...
    this.prevRoute ...
  });
    _router.subscribe... funktioniert nicht in RC4
    Danke für den Tipp! Aktualisiert. Siehe auch stackoverflow.com/questions/33520043/...
    Dieser Ansatz ist zu helfen, mich zu re-schreiben Sie eine nicht-standard-breadcrumb. Sehr praktisch!
    Ich hatte zu gehen Sie zur vorherigen Seite nach bestimmten Betrieb. Dies löste das problem mit minimalem code. Danke!
    Ps. Ich bin jetzt über einen Dienst, die ich denke, ist eine gute Praxis. Außerdem, was ist der Typ von e wenn ich den update - Beispiel oben? Derzeit hacking es so: const prev = <NavigationEnd>e[0] const cur = <NavigationEnd>e[1] console.log('Previous url' + prev.url) console.log('Previous url' + cur.url)

    InformationsquelleAutor Günter Zöchbauer

  2. 1

    Ja, ich würde es so machen:

    @Injectable() //do not forget to register this class as a provider
export class PreviousRouteRecorder implements CanDeactivate<any> {
  constructor(private router: Router) {
  }
  canDeactivate(component: any): Observable<boolean> | boolean {
    localStorage.setItem('previousRoute', this.router.url);
    return true;
  }
}

export const ROUTES: Routes = [
  {
    path: 'first',
    component: FirstComponent,
    canDeactivate: [PreviousRouteRecorder]},
  {
    path: 'second',
    component: SecondComponent
  }
];

export class SecondComponent implements OnInit {
  ngOnInit(){
    console.log(localStorage.getItem('previousRoute'));
  }
}

    InformationsquelleAutor Stephen Paul

  3. 1

    Winkel 6 aktualisiert code für das abrufen bisherige url als string.

    import { Component, OnInit } from '@angular/core';
import { Router, RoutesRecognized } from '@angular/router';
import { filter, pairwise } from 'rxjs/operators';


export class AppComponent implements OnInit {

    constructor (
        public router: Router
    ) {
    }

    ngOnInit() {
        this.router.events
            .pipe(filter((e: any) => e instanceof RoutesRecognized),
                pairwise()
            ).subscribe((e: any) => {
                console.log(e[0].urlAfterRedirects); //previous url
            });
    }

    InformationsquelleAutor Franklin Pious

  4. 0

    Können Sie dies mit document.referrer

    if(document.referrer !== '/myapp/signup'){
    location.back()
}
    Funktioniert nicht wenn ich es Teste. Dokument.referer gibt nichts auf alle Fälle. Vielleicht ist es nicht Verhalten, das auf diese Weise, wenn in angular2 ?
    Im mit angular2 router.navigieren navigieren Sie zu dem neuen Staat!
    Aha, Sie sind also nicht aus anderen url? Die url ändert sich nicht?
    Ich komme von einer anderen URL. Ich bin in localhost/myapp/signup und ich navigieren Sie zu " /myapp/login MIT Winkel-Router.navigate-Methode. Für einige Grund-Dokument referer ist immer leer, egal, wo ich herkomme, /myapp/login. Ich m denken eckige soll diese Funktion wissen, welche url ich komme.

    InformationsquelleAutor Bob van Luijt

  5. 0

    Können Sie vielleicht nutzen, die OnActivate phase mit der routerOnActivate Methode, die Ihnen Zugang zu der früheren url und dem aktuellen.

    routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) {
  console.log(`Finished navigating from "${prev ? prev.urlPath : 'null'}" to "${next.urlPath}"`);
}
    dies funktionierte gut für mich, cheers, müssen nur sicherstellen, dass ComponentInstruction importiert 🙂 import {Router, ComponentInstruction} from 'angular2/router';
    Dies ist veraltet.

    InformationsquelleAutor cexbrayat

  6. 0

    Umsetzung mit paarweisen wird nicht funktionieren, wenn der Benutzer nicht über die navigation auslösen Ereignis mindestens zwei mal und möglicherweise einen kleinen bug.

    Seite 1 -> Seite 2
    ---> Navigations-Ereignis ausgelöst, aber Beobachtbaren Ereignis hat nur den Wert 1 und somit paarweise nicht ausstrahlt
    ---> Benutzer kann nicht zurück zu Seite 1

    Seite 2 -> Seite 3
    --> Ereignis Beobachten hat jetzt 2 Elemente und paarweise emittiert

    Ich Frage mich, ob es einen workaround?

    Lesen Sie die Hilfe, nicht nach Fragen und Kommentare Antworten. Wenn Sie kommentieren möchten, andere beantworten und Sie es nicht tun können, versuchen zu Stufe nach oben, erste.
    Vielleicht sollten Sie Lesen, die helfen zu verstehen, dass nicht jeder kann einen Kommentar schreiben. Solchen ärger empfangen von Benachrichtigungen aus, die Sie für nichts
    Ich war nur die Berichterstattung die Regeln dieser Seite. Ich habe auch angefangen, von 1 Ruf ohne Kommentare, damit ich weiß, wie es ist, und dies befreit nicht von der Einhaltung der Regeln.

    InformationsquelleAutor Hou

  7. 0

    Können Sie die bisherige url mit einem auth Wache und setzen die Vorherige url in jedem waren von der Anwendung.

    canActivate(route: ActivatedRouteSnapshot, snapshot: RouterStateSnapshot) {
                this.commonService.prevRouter = this.router.url;
}

    InformationsquelleAutor Soumya K

  8. -1
    import {Location} from '@angular/common';

 private currentLocation;
 constructor(private location: Location){
    this.currentLocation = this.location.path();  
   }

ngAfterViewInit() {
 let instance = this;
 this.router.parent.subscribe(() => {            
        if (instance.currentLocation != instance.location.path()) {
             console.log("previous -> "+instance.currentLocation+" != next -> "+instance.location.path());             
        }else{
            console.log("previous -> "+instance.currentLocation+" == next -> "+instance.location.path());
        }
    });
}

    InformationsquelleAutor Jean Palmeira

Schreibe einen Kommentar