Angular2 Routerlink:添加查询参数

Question

如何添加查询参数routerLink？

@RouteConfig {
   {path: '/search',   name: 'Search', component: SearchCmp}
}  

让我们说要前往/search?q=asdf,

<a [routerLink]= " [ '/Search' , {q= 'asdf'}] ">Link 1</a>

这解决了/search.

有没有办法添加查询参数而不使用:

this.router.navigate( ['Search', { q: 'asdf'}]);

要么

<a href="/search?a=asdf"> Link 2 </a>

？

Answer 1

OP(原始海报)询问如何通过路由器链接添加查询参数,而不是像@SaUrAbH MaUrYa回答的路由器参数.

要添加查询参数,您需要使用[queryParams]绑定:

<a [routerLink]="['/users']" [queryParams]="{ page: 1 }">next page</a>

Answer 2

如果你需要的东西/search?q=asdf比你可以简单地使用:

@RouteConfig {
   {path: '/search',   name: 'Search', component: SearchCmp}
}

//And to generate router Links use:

<a [routerLink]="['/Search']" [queryParams]="{q:'asdf'}"></a>

这将生成href标记,<a href="/search"但单击锚标记将引导您进入URL /search?q=asdf.[queryParams]将允许您使用"？"添加查询参数,否则它们将被";"附加.您可以在SearchCmp使用中获取此参数:

constructor(private _routeParams: RouteParams) {
   var queryParam = this._routeParams.get('q');
}