Angular 如何根据导航的路线更改导航菜单
我试图根据路线变化显示不同的标题菜单。目前,我所拥有的只有在刷新路线的情况下才能正常工作。然而,如果您在没有页面刷新的情况下单击从一个页面到另一个页面的链接,则不会发生更改 这是我的app.component.tsAngular 如何根据导航的路线更改导航菜单,angular,angular2-routing,angular2-template,Angular,Angular2 Routing,Angular2 Template,我试图根据路线变化显示不同的标题菜单。目前,我所拥有的只有在刷新路线的情况下才能正常工作。然而,如果您在没有页面刷新的情况下单击从一个页面到另一个页面的链接,则不会发生更改 这是我的app.component.ts export class AppComponent { isHeader: boolean; title = 'app works!'; progress: number = 0; items: FirebaseListObservable<any[]&
export class AppComponent {
isHeader: boolean;
title = 'app works!';
progress: number = 0;
items: FirebaseListObservable<any[]>;
name: string;
constructor(private titleService: Title, af: AngularFire, private _r: Router) {
this.name = 'Angular2'
this._r.events.subscribe(event => {
if (event instanceof RoutesRecognized) {
console.log('navigated to:', event.url);
console.log('route state', event.state);
console.log('');
}
else if (event instanceof NavigationEnd) {
// if u dont need the state, you could even use this event-type..
console.log('navigated to:', event.urlAfterRedirects);
if(event.urlAfterRedirects === '/home'){
console.log("this is home");
this.isHeader = true;
}
}
});
}
它是否击中了
控制台。log
?我在控制台中正确获得了路线更改。
<!--*ngIf="!isHeader"-->
<div *ngIf="isHeader">
Navigation just for the home route if route end === /home
</div>
<div *ngIf="!isHeader">
navigation for other routes but not the homepage
</div>
if(event.urlAfterRedirects === '/home'){
console.log("this is home");
this.isHeader = true;
}