我最终把urlTree和location.go结合起来

const urlTree = this.router.createUrlTree([], {
       relativeTo: this.route,
       queryParams: {
           newParam: myNewParam,
       },
       queryParamsHandling: 'merge',
    });

    this.location.go(urlTree.toString());

不确定toString是否会导致问题，但不幸的是location。Go似乎是基于字符串的。

您可以使用新的查询参数导航到当前路由，这不会重新加载页面，但会更新查询参数。

类似于(在组件中):

import {ActivatedRoute, Router} from '@angular/router';

constructor(
    private router: Router,
    private activatedRoute: ActivatedRoute,
) { }

public myMethodChangingQueryParams() {
  const queryParams: Params = { myParam: 'myNewValue' };

  this.router.navigate(
    [], 
    {
      relativeTo: activatedRoute,
      queryParams: queryParams, 
      queryParamsHandling: 'merge', // remove to replace all query params by provided
    });
}

注意，虽然它不会重新加载页面，但它会将一个新条目推送到浏览器的历史记录中。如果你想在历史记录中替换它，而不是在那里添加新的值，你可以使用{queryParams: queryParams, replaceUrl: true}。

编辑: 正如评论中已经指出的，[]和relativeTo属性在我最初的示例中缺失，因此它也可以更改路由，而不仅仅是查询参数。正确的this.router.navigate用法如下:

this.router.navigate(
  [], 
  {
    relativeTo: this.activatedRoute,
    queryParams: { myParam: 'myNewValue' },
    queryParamsHandling: 'merge'
  });

将新的参数值设置为null将从URL中删除参数。

Try

this.router.navigate([], { 
  queryParams: {
    query: value
  }
});

将工作于同一路线导航，而不是单引号。

在Angular 5中，你可以通过解析当前url来轻松获取和修改urlTree的副本。这将包括查询参数和片段。

  let urlTree = this.router.parseUrl(this.router.url);
  urlTree.queryParams['newParamKey'] = 'newValue';

  this.router.navigateByUrl(urlTree); 

修改查询参数的“正确方法”可能是使用 创建一个新的UrlTree从当前，同时让我们修改它使用NavigationExtras。

import { Router } from '@angular/router';

constructor(private router: Router) { }

appendAQueryParam() {

  const urlTree = this.router.createUrlTree([], {
    queryParams: { newParamKey: 'newValue' },
    queryParamsHandling: "merge",
    preserveFragment: true });

  this.router.navigateByUrl(urlTree); 
}

为了以这种方式删除查询参数，可以将其设置为undefined或null。

你也可以像这样添加行为主体:

refresher$ = new BehaviorSubject(null);

我改变了我的代码:

this.route.queryParamMap.subscribe(some code)

to:

combineLatest([
    this.route.queryParamMap,
    this.refresher$
])
  .pipe(
     map((data) => data[0])
  )
  .subscribe(here is your the same code)

当你需要刷新订阅时，你需要调用这个:

this.refresher$.next(null);

不要忘记添加unsubscribe from the ngOnDestroy

如果你想改变查询参数而不改变路由。见下文 下面的例子可能对你有帮助: 当前路由为:/search &目标路由是(没有重载页面):/search?查询=爱

    submit(value: string) {
      this.router.navigate( ['.'],  { queryParams: { query: value } })
        .then(_ => this.search(q));
    }
    search(keyword:any) { 
    //do some activity using }

请注意:您可以使用this.router。导航(['search']而不是this.router。导航((“。”)