Angular 2拦截路由事件,然后稍后路由

发布时间：2020-12-17 10:34:33 所属栏目：安全来源：网络整理

导读：我有一个角度2应用程序,并希望拦截路线事件,防止它们发生,播放动画,然后继续路由. 我的想法是这样的如果我有课 export class SomeComponent { constructor(private router: Router){ router.events.subscribe(evt = { if(evt instanceof NavigationStart){

我有一个角度2应用程序,并希望拦截路线事件,防止它们发生,播放动画,然后继续路由.

我的想法是这样的

如果我有课

export class SomeComponent {
    constructor(private router: Router){
        router.events.subscribe(evt => {
            if(evt instanceof NavigationStart){
                //I would like to cancel the event here the first time,and then 
                //play an animation,after the animation is done,trigger the router
                //to go to the original route it wanted to.
            }
        })
    }
}

有没有办法阻止该路由器完成导航过程？

您可以为父路径创建CanActivate防护,您可以根据某些全局变量停止导航.变量可以具有基于动画是否已显示的值.

所以你可能会做的是,

export class AnimationGuard implements CanActivate {
  canActivate(route: ActivatedRouteSnapshot,state: RouterStateSnapshot) {
    if(HasAnimationRun){
      return true;
    }
    runAnimation(state.url);
    return false;
  }
}

runAnimation(url){
  // run animation
  // set global variable.
  // navigate to url
}

了解有关CanActivate here的更多信息.

希望这可以帮助！！

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!