Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

some part of URL path is removed and double nagivation in browser history

Tags:

angular

I am using the navigate function of Router in angular. This is resulting in navigating once but creating two navigations in history and URL is automatically updated with some part of URL being stripped off like mentioned below:

this.router.navigate(['buses','big','bus-details'],queryParamas:{busId:'abc'}); then in the first navigation the url would be localhost:4200/buses/big/bus-details?busId=abc but not even in a second the url will be updated to localhost:4200/buses/big/bus-details and when I click back button of browser I am taken to url localhost:4200/buses/big/bus-details?busId=abc although the ngOnInit() function is called only once while moving from first update to second update of url.

I have always been navigating like this but there has never been a problem. I have even checked that NavigationStart event is only fired once.

What I am looking for is that this update of URL should not happen, what can I do to prevent update of URL while navigating?

Update: I have observed this error occurs only when routing through a specific feature module but If I route to the module from Root AppModule this URL updation doesn't take place and neither are two navigations created i.e. I don't need to click back button twice to go the path/component from which I called navigate function. So this seems to be an error in feature module through which the navigations are being done and not the components to which I am navigating.

like image 481
Kartik Watwani Avatar asked Nov 07 '22 17:11

Kartik Watwani


1 Answers

After the update that I added to my question I was able to solve my problem although I wasn't able to figure out the root cause of why this was happening. Previously when I was facing the problem I was calling navigate function from the Router object received in a component which was declared inside Feature module and I also observed this navigation error was occuring only from feature module component and not from component defined in AppModule so there was a service which was defined in AppModule, I first injected that service in feature module component and then used the Router object of that service to call navigate function like shown below and everything was running smoothly.

this.globalService.router.navigate(path);
like image 93
Kartik Watwani Avatar answered Nov 15 '22 05:11

Kartik Watwani