Angular 2路由器全局狀態更改事件

Question

有一個全局事件，我們可以在狀態更改/啟動時使用，而不是組件生命周期掛鈎 ，而不是每個組件？ 像在UI路由器中：

  $rootScope.$on("$stateChangeStart", function() {})

Answer 1

這取決於你想要實現的目標，但是可以在你的頂級組件中注入Router ，並將.subscribe()注入它以獲得狀態流。

我用它來構建基於當前狀態更改瀏覽器標題的功能。 話雖如此，你可以認為它等同於來自Angular 1的$stateChangeSuccess和$stateChangeFailure事件。

代碼將是：

constructor(router: Router) {
    router.subscribe(successHandler, failureHandler);
}

另請參閱OnActivate ，它也與這些概念有關。

Answer 2

我的代碼，對於ui-router，最終看起來類似於以下代替Angular2的ng1 $ rootScope $ stateChangeSuccess：

import { Component } from '@angular/core';
import { TransitionService } from "ui-router-ng2";

@Component({selector: 'app-stage-tag',template: '...'})
class AppComponent {
  constructor(public transitionService: TransitionService){
    transitionService.onSuccess({to:'*'}, transition=>{
      console.log('state', transition._targetState._definition)
      console.log('params', transition._targetState._params)
    })
  }
}