Question

我想在网址上添加其他参数。在我的搜索页面中搜索后，我有这个网址： http://localhost:62265/result?search=sas

这是结果页面的链接。其中“sas”是搜索的关键字。

现在同一页面中会有其他过滤器。我会进一步过滤我当前的结果。示例：按国家/地区定位，因此网址应如下所示。

http://localhost:62265/result?search=sas&country=Germany

这是我目前的实施方式。

SearchComponent.ts

//when a button is clicked it goes to this function.
search(){
  this.router.navigate(['/result'], { queryParams: { search: this.query } });
  //this is what I use to go to the result page.
}

AppModule.ts

const routes: Routes = [
  //other paths
  { path: 'result', component: ResultComponent }
 ];

问题是如何在添加其他功能后将“＆amp; country = Germany”添加到同一组件中？我正在摆弄路由器模块的功能，找不到能够完成工作的人。

Answer 1

我认为您需要使用

扩展您的对象

{ search: this.query,
 country: [your country reference] }

Answer 2

为路线创建一个构建queryParams的函数。根据您的条件在对象中添加参数。例如，您可以这样做：

buildQueryParams() {
    const params: any = {};

    if(this.query) { Object.assign(params, {search: this.query}); }
    if(this.country) { Object.assign(params, {country: this.country}); }
    if(this.otherParam) { Object.assign(params, {otherParam: this.otherParams}); }

    return params;
}

然后您可以在search()方法中调用该函数：

search(){
  this.router.navigate(['/result'], { queryParams: buildQueryParams() });
}

使用Angular

2 个答案: