使用带有queryParams的角度路由器

Question

当前在angular v8上，并使用queryParams进行一些网络调用。

问题在于角度queryParams如何将其传递到路线的格式。

例如。...

当前网址：

  

/ inbox; name = 123; tab = first

我想要的网址：

  

/ inbox？name = 123＆tab = first

我当前拥有的代码：

  onClick(report) {
    if(report) {
      this.router.navigate(['/inbox', { name: this.id, tab: this.tab }]);
    }
  }

Answer 1

使用它，它真的很容易阅读，并为您提供了很多有用的信息。

https://alligator.io/angular/query-parameters/

这是第一个示例：

goProducts() {
  this.router.navigate(['/products'], { queryParams: { order: 'popular' } });
}

Answer 2

在我的导航服务中，我有这个。这是一种可重用的功能，可浏览应用程序。

navigateTo(page: string, data?: any): Promise<void> {
      return this.router.navigate([page], {queryParams: data, skipLocationChange: true})
        .then(success => {
          if (!success) {
            console.error('navigation failed');
          }
        });
  }