Issue
Something like that tell me the event NavigationCancel
occurs, but I would like to know whatever did trigger that:
e.g. AppComponent (excerpt):
constructor (
....
private router: Router
) {
router.events.subscribe(e => {
if (e instanceof NavigationCancel) {
// PLEASE TELL ME, WHO DID CALL ME ? <---
}
});
}
Something (a guard, msal,.. etc.) deletes the route every time if I refresh the browser, the last visited route
is gone. Deep Linking is currently not possible.
A workaround would be: I would have to save the last route in the LocalStorage and force the application to switch to that route. Maybe if I can find the trigger, perhaps I'll find another solution.
The solution is there (Angular 14+)
Solution
Just faced the same problem, and found a way to debug it. Inject Router
to your page component and subscribe to its events like this:
this.router.events.subscribe(e => {
// using `instanceof` you can filter the events of interest
if (e instanceof NavigationCancel) debugger;
})
Open DevTools in the browser, and try reproducing the issue. When the debugger is activated, it will be still quite difficult to find the root cause. I had to scroll down the Stack Trace and look through some internal Angular/RxJS code in order to find when the new navigation event with a different id is fired.
In my case, turned out that I indirectly called router.navigate
too soon before the previous navigation was resolved. That's the reason for seeing that error: "Navigation ID 2 is not equal to the current navigation id 3" - Angular Router detected that new navigation (with id=3) has been triggered, and therefore canceled the previous navigation (with id=2), which was almost done. As a result, I had problems with outdated query params.
Introducing an artificial delay before the second navigation solved the issue.
Answered By - Alexey Grinko
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.