Angular 4 Router - Hook每个路由器都改变了

Question

我想创建一个Breadcrumb。

Breadcrumb Wikipedia

而对于这一点，我想到了创建服务来处理它。但是我需要挂钩每个路由器的变化，每次路由器状态改变时都会使用一种方法或类。

无需在我的所有组件中添加onActivate方法，都可以解决此挑战，因为我有很多组件。

非常感谢！

Answer 1

您可以使用Router events跟踪路由变化

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

class MyService { 

    constructor(private router: Router) { 
    this.router.events 
     .filter(e => e instanceof NavigationEnd) 
     .subscribe(e => console.log('Route changed: ' + e.url); 

    } 

}