如何在NavigationStart路由器事件中暂停路线更改 [英] How to pause the route change in navigationStart router event

查看:126
本文介绍了如何在NavigationStart路由器事件中暂停路线更改的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的应用程序中,我从包(节点模块)暴露了路由。因此,我无法对节点模块内定义的路由使用canActivate或canDeactivate。

In my application I have routes exposed from packages (node modules). So i couldn't use canActivate or canDeactivate for the routes defined inside node modules.

因此,我开始订阅应用程序组件中的所有路由更改,并根据条件重定向用户到不同的路由。

So I started subscribing to all route change in my app component and based on condition i am redirecting the user to different routes.

由于条件具有API调用,因此路由更改不会在navigationStart中暂停,而是会完成到其他页面的路由,并且一旦API调用成功将重定向重定向到另一条路由。

Since the condition has API call, the route change is not paused in the navigationStart instead it completes the routing to other page and once API call is successful the redirect happens to the other route.

我该如何处理?无论如何,是否可以在navigationStart中暂停路由更改并在API调用后启用路由,或者是否有其他方法为所有路由(包括来自节点模块的路由)定义canActivate。

How can i handle this? Is there anyway to pause the route change in navigationStart and enable the route after the API call or is there any other way to define canActivate for all routes including the routes from node modules.

推荐答案

是的,通过使用解析器,您可以实现

Yes, by using resolver you can achieve this,


  1. 首先创建解析器服务,该服务将实现 Resolve接口。

  1. You need to create resolver service first which will implement "Resolve" interface.

在resolve函数内部,进行API调用。

Inside the resolve function, make the API call.

并在如下的路由声明中添加服务=>
resolve:{data:ResolveService}

And add the service inside the route declarations like this => resolve: {data: ResolveService}

所以,直到进行API调用并且不返回数据,它才会启动navigationStart
请查看这篇文章
https://codeburst.io/understanding-resolvers-in-angular-736e9db71267

So, until the API call is made and it doesn't return the data, it won't start the navigationStart Please have a look at this article https://codeburst.io/understanding-resolvers-in-angular-736e9db71267

这篇关于如何在NavigationStart路由器事件中暂停路线更改的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆