我有使用Angular 1中的ui-router的经验,现在我想知道如何在ui-router-ng2中监听$stateChangeStart
。
请告诉我如何在Angular 2中完成以下Angular 1代码片段。
$rootScope.$on('$stateChangeStart', function(event, next) {});
我有使用Angular 1中的ui-router的经验,现在我想知道如何在ui-router-ng2中监听$stateChangeStart
。
请告诉我如何在Angular 2中完成以下Angular 1代码片段。
$rootScope.$on('$stateChangeStart', function(event, next) {});
举个例子,这是一个不错的 Plunkr:
https://plnkr.co/edit/k8PgPKRNu0llT521p5R5?p=preview
在ui-router-ng2中,你需要使用服务(TransitionService)来管理所有状态声明周期:
1) 你需要在构造函数中注入该服务:
import {TransitionService} from "ui-router-ng2";
constructor(private transitionService:TransitionService) {}
2) 回调函数:
transitionService.onStart({}, ()=>{
console.log("state changed");
})
在第一个值上,您可以放置条件,例如:
transitionService.onStart({from: 'home', to: 'other'}, ()=>{
console.log("state changed");
})
(仅当当前状态为“home”且下一个状态为“other”时,回调函数才会被调用)
** 您还可以调用 onSuccess、onError、onEnter、onFinish 等等...
希望这对您有所帮助,
祝您好运!
ngOnDestroy
被销毁,它们必须被显式地清理。 - Chris T