Angular2如何做一个url查询字符串

Question

我的应用程序上有一个搜索功能，可以搜索产品列表，这一切都没问题但是我想将用户重定向到另一个页面www.site.com/search?keyword=perfume

我只能将其www.site.com/search/perfume和www.site.com/search;keyword=perfume

路由器导航this.router.navigate(['search', {keyword: searchVal}]);执行此结果为www.site.com/search;keyword=perfume

路线

const appRoutes: Routes = [
  { path: 'search', component: SearchComponent} 
];

搜索功能：

findproduct(searchTerm: HTMLInputElement): void {
var searchVal = searchTerm.value;
this.productService.searchproduct(searchVal)
  .subscribe(data => {
    this.router.navigate(['search', {keyword: searchVal}]);
    console.log(data)
  });

}

如何将我的网址设为www.site.com/search?keyword=perfume

Answer 1

您应该使用queryParams：

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

Answer 2

您应该按照以下步骤更新您的appRoutes：

const appRoutes: Routes = [
  { path: 'search/:keyword', component: SearchComponent} 
];