CODEWITHSUNDEEP
angularquery-string
amit_chauhan
amit_chauhan

Reputation: 501

How to set query parameters to url Angular2?

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.

Upvotes: 22

Views: 28149

Answers (4)

Volodymyr Khmil
Volodymyr Khmil

Reputation: 1244

You need to update your router.navigate

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

Upvotes: 2

Günter Zöchbauer
Günter Zöchbauer

Reputation: 658175

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

Upvotes: 6

amit_chauhan
amit_chauhan

Reputation: 501

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.

Upvotes: 15

Pstr
Pstr

Reputation: 857

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

Upvotes: 23

Related Questions