Angular Router Ereignisname

Question

Der Angular (2+) -Router verfügt über eine events-Eigenschaft, die ein rxjs-Objekt ist.

Einmal angemeldet, können Sie wie für Veranstaltungen hören:

router.events.subscribe((event: Event) => { console.log(event) });

aber das Problem ist, dass Sie keine Möglichkeit haben, den Ereignistyp zu erhalten, da es für alle Veranstaltungen hört. Eine hacky Lösung ist, dass Sie den Konstruktor Namen des Ereignisses wie überprüfen können:

router.events.subscribe((event: Event) => { 
    if(event.constructor.name === 'NavigationStart') { 
    loadingService.start(); 
    } else if(event.constructor.name === 'NavigationEnd') { 
    loadingService.complete(); 
    drawerService.destroyAll(); 
    } 
}); 

Ich war gespannt, ob es ein besserer Weg, dies zu erreichen war?

Answer 1

Event ist nur die Basisklasse.

Die konkreten Ereigniswerte sind eine der

• NavigationStart
• NavigationEnd
• NavigationCancel
• NavigationError
• RoutesRecognized

Sie können zum Beispiel den Einsatz:

constructor(router:Router) { 
    router.events 
    .filter(event => event instanceof NavigationStart) 
    .subscribe((event:NavigationStart) => { 
     // You only receive NavigationStart events 
    }); 

Siehe auch How to detect a route change in Angular 2?