## 一、路由事件 >[info] 在每次導航中，Router都會通過Router.events屬性發布一些導航事件。這些事件的范圍涵蓋了從開始導航到結束導航之間的很多時間點。 > | 路由器事件 | 說明 | | --- | --- | | NavigationStart | 本事件會在路由開始時觸發 | | RouteConfigLoadStart | 本事件會在Router惰性加載某個路由配置之前觸發。 | | RouteConfigLoadEnd |本事件會在惰性加載了某個路由后觸發。 | | RoutesRecognized | 本事件會在路由器解析完 URL，并識別出了相應的路由時觸發 | | GuardsCheckStart | 本事件會在路由器開始 Guard 階段之前觸發。 | |ChildActivationStart |本事件會在路由器開始激活路由的子路由時觸發。 | | ActivationStart | 本事件會在路由器開始激活某個路由時觸發。 | | GuardsCheckEnd |本事件會在路由器成功完成了 Guard 階段時觸發。| | ResolveStart |本事件會在 Router 開始解析（Resolve）階段時觸發。| | ResolveEnd |本事件會在路由器成功完成了路由的解析（Resolve）階段時觸發。 | | ChildActivationEnd |本事件會在路由器激活了路由的子路由時觸發。 | | ActivationEnd|本事件會在路由器激活了某個路由時觸發。 | | NavigationEnd | 本事件會在導航成功結束之后觸發。 | | NavigationCancel |本事件會在導航被取消之后觸發。 這可能是因為在導航期間某個路由守衛返回了 false。 | | NavigationError | 這個事件會在導航由于意料之外的錯誤而失敗時觸發。 | | Scroll | 本事件代表一個滾動事件。 | ## 二、監聽路由事件 ``` import {Router,NavigationStart} from "@angular/router"; import { filter } from 'rxjs/operators'; //引入Router模塊，引入NavigationStart路由開始事件 //引入filter 模塊 constructor(router:Router) { } //監聽路由開始事件 ngOnInit(){ //監聽路由事件 this.router.events.pipe( filter(e => e instanceof NavigationStart) ).subscribe(e =>{ console.log('路由開始了') }) } ```