How to set query parameters to url Angular2?

Question

I have a requirement to set a url with query parameters like /Questions?id=1234&pageid=0. I have tried to do it via router.Navigate['/Questions?id=1234&pageid=0'] but no luck.

After navigation browser shows like /Questions%3Fid%3D1234%26pageid%3D0.

I have also tried it with setting routerLink="/Questions?id=1234&pageid=0", but same result.

Please suggest any solution to do it.I am using rc5 for angular2.

Answer 1

You can pass them as item in the router, but outside the commands array:

[routerLink]="["/Questions"], {queryParams: {id:1234, pageid:0}}"

this generates what you want: /Questions?id=1234&pageid=0

Or you can use it programmaticaly:

this.router.navigate(['/Questions'], { queryParams: {id:1234, pageid:0} })

with router being an instance of @angular/router's Router

Answer 2

I found one solution by giving router-link and query-parameters separate, like below:

<a [routerLink]="['/Questions']" [queryParams]="{id:1234,page:1}"></a>

This is working fine for me.

Answer 3

You can pass them as items in the router commands array:

[routerLink]="['/Questions'] [queryParams]="{id:1234, pageid:0}} ]"

See also https://angular.io/docs/ts/latest/guide/router.html#!#query-parameters

Answer 4

You need to update your router.navigate

this.router.navigate(['/Questions', {id: 1234, pageid: 0}]);