Question

是否有一种干净的方法将当前可选的queryParams与模板中的链接上的其他可选queryParam合并？

当前网址：/search;brand=Trek

所需的转到链接：/search;brand=Trek;start=1（startCount将递增）

我知道Angular支持合并普通 queryParams（https://angular.io/docs/ts/latest/api/router/index/RouterLink-directive.html）的功能，但我认为它不适用于可选 queryParams。< / p>

这就是为什么这不起作用：

<a class="nav-btn"
   queryParamsHandling="merge"
   [routerLink]="[ { start: startCount+1 } ]">
    Next Page
</a>

有什么建议吗？

Answer 1

尝试

<a class="nav-btn"
   queryParamsHandling="preserve" <--- instead of 'merge'
   [routerLink]="[ { start: startCount+1 } ]">
    Next Page
</a>

Answer 2

我不认为最新版本的Angular可以实现这一点，所以这是我的解决方案：

订阅并保存参数：

ngOnInit() {
  this.route.params.subscribe((params: Params) => {
    for(let param in params){
        if(params.hasOwnProperty(param)){
            console.log('param:', param);
            this.currentParams[param] = params[param];
        }
    }
  });
}

然后向currentParam对象添加其他可选参数：

this.currentParams.start = this.startCount+1;

使用所有参数重新导航到您的路线：

this.router.navigate([ 'search', this.currentParams ]);

Answer 3

用于保留和合并现有的查询参数：

<a class="nav-btn" preserveQueryParams [routerLink]="['/yourRoute']" [queryParams]="{start: startCount+1}"></a> <a class="nav-btn" mergeQueryParams [routerLink]="['/yourRoute']" [queryParams]="{start: startCount+1}"></a>

Angular RouterLink queryParamsHandling用于可选参数

3 个答案: