Angular 2 routerLink params & query params

Here is my route:

{ path: 'market/:currency', component: MainlayoutComponent, canActivate: [AuthGuard]}

I want redirect to with query params like this:


<a [routerLink]="['/market', currency]" [queryParams]="{sidebar: 'home'}"></a>

But when i click its redirect market/btc

What's the problem.

4 answers

  • answered 2018-05-16 06:25 Prachi

    Try using:

    <a [routerLink]="['/market', currency]" [queryParams]="{sidebar: home}"></a>

  • answered 2018-05-16 06:28 CruelEngine

    you just need to preserve your queryParams :


    Add the above attribute/directive to your route :

    <a [routerLink]="['/market', currency]" [queryParams]="{sidebar: 'home'}" queryParamsHandling="preserve"></a>

  • answered 2018-05-16 06:38 Sangwin Gawande

    There is no issue in your code. I tried following and its working nicely.

    I have even added an extra parameter.

    <a [routerLink]="['/market', currency]" [queryParams]="{sidebar:'home',tab:'5'}">Go to market</a>

    TS :

    const routes: Routes = [
        { path: "market/:currency", component: AppComponent}

    I am getting following result :


  • answered 2018-05-16 06:50 fateme fazli

    you can try:

    <a [routerLink]="'/market/'+ currency" [queryParams]="{sidebar: 'home'}"></a>


    <a routerLink = "/market/{{currency}}" [queryParams]="{sidebar: 'home'}"></a>