java - 如何在 Angular 7 中使用字符串添加动态查询参数？

Question

目前我在屏幕上有多个下拉字段。当选择的下拉值传递到查询参数时，所以我想创建添加的动态查询参数。我的代码如下

     // this is one of the dropdown value
    if (this.SearchText) {
        query += 'q:' + SearchText + ',';
       }
// this is the second one of dropdown value 
    if (this.MakeId) {
        makename = this.SpaceToDash(this.MakesList.find(x => x.Id === +this.MakeId).Name);
        navigateUrl += '/' + makename;
        query += 'merk:' + this.MakeId + ',merkname:' + makename + ',';
       }
    this.router.navigate([ navigateUrl ], { queryParams: { query } });

因此，如果“MakeId”不是下拉值，则不应添加到“queryParams”中，那么我该怎么做。上述解决方案不起作用。

应用 Dynamically create query Params in Angular 2 的解决方案但这不符合我的要求。那么你能帮助我吗？

Answer 1

QueryParams 应采用对象而不是字符串，

所以你可以这样做

let query = {};
// this is one of the dropdown value
if (this.SearchText) {
    query['q'] =  SearchText;
   }
// this is the second one of dropdown value 
if (this.MakeId) {
    makename = this.SpaceToDash(this.MakesList.find(x => x.Id === +this.MakeId).Name);
    navigateUrl += '/' + makename;
    query['merk'] =  this.MakeId;
    query['makename'] =  makename;
   }
this.router.navigate([ navigateUrl ], { queryParams:  query  });