URL Encoding breaking angular 2 navigation

Question

I have a website developed in angular 2. When I provide optional parameters to it in chrome e.g.

https://aglplus-ui-demo.azurewebsites.net/home?error_code=10000&transaction_id=1543

This gets converted to

https://aglplus-ui-demo.azurewebsites.net/home%3Ferror_code%3D10000%26transaction_id%3D1543

and is unable to find the page in chrome. However, when I paste the same url in incognito mode, it runs perfectly. I am new to angular and am unable to find a cause for the same. Could you please direct me to the right direction.

Tonnie

Answer 1

The issue was happening when I was logged in to the system. There was a validation function which was redirecting using router.navigate(). Changing that to router.navigateByUrl() fixed the issue. However, I am not sure why that is the case. If someone can guide me regarding the same, I will be very obliged.

Tonnie

Answer 2

If you have a path with a hash parameter and query parameters and you want to use 'navigate' method, you have to use the following form:

router.navigate([path], {queryParams: queryParams, fragment: fragment, relativeTo: route});

Or, as answered @krishanu-choudhury, you can use the

router.navigateByUrl()

method.

Sacellum