gpt4 book ai didi

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

转载 作者:太空狗 更新时间:2023-10-29 17:13:46 28 4
gpt4 key购买 nike

我有一个 Angular 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 .

希望这对您有所帮助!

关于Angular 2拦截路由事件然后路由,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41704824/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com