Angular2 Routerlink:添加查询参数 [英] Angular2 Routerlink: add query parameters

查看:173
本文介绍了Angular2 Routerlink:添加查询参数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何将查询参数添加到routerLink?

How can I add query parameters to routerLink?

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

让我说我要转到/search?q=asdf

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

此解析为/search.

是否可以不使用以下方法添加查询参数:

Is there a way to add query parameters without using:

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

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

?

推荐答案

如果您需要/search?q=asdf之类的东西,则可以简单地使用:

If u need something as /search?q=asdf than you can simply use:

@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中使用以下命令获取此参数:

This will generate the href tag as <a href="/search" but on clicking the anchor tag will lead you to url /search?q=asdf. [queryParams] will let you add the query params with "?", otherwise they will be appended by ";". You can get this parameter in your SearchCmp using:

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

这篇关于Angular2 Routerlink:添加查询参数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆