Angular 5+ routerLinkActive 不适用于重复参数

Question

在我的小例子here 中，以下路径一切正常：

https://angular-d7eqku.stackblitz.io/path1

https://angular-d7eqku.stackblitz.io/path1?param1=1

但是如果我使用重复的查询参数来传递一组值 routerLinkActive 刹车：

https://angular-d7eqku.stackblitz.io/path1?param1=1&param1=2

这是一个错误吗？我怎样才能绕过它？ 在 Angular 5/6 中测试过。

更新： 我稍微更新了我的示例，以说明为什么我想以这种方式传递一组参数（而不是将其作为具有多个值的一个参数传递）以及我如何使用它。

更新 2： 删除 [queryParamsHandling]="'preserve'" 后，它开始工作，因此问题可以缩小到： 为什么 routerLinkActive 在 queryParamsHandling="preserve" 时对重复参数不起作用。

Answer 1

要将数组传递给查询参数，您可能必须使用,，因此链接应如下所示：

https://angular-d7eqku.stackblitz.io/path1?param1=1,2

路由快照（ActivatedRoute.snapshot）将如下所示：

{
  ...
  queryParams: {
    param1: "1,2"
  },
  ...
}

更新：

好的，误解了这个问题。因此，如果您将 app.component.html 更改为以下代码 - 它会起作用：

<ul>
  <li><a routerLink="path1" routerLinkActive="active">Item1</a></li>
  <li><a routerLink="path2" routerLinkActive="active">Item1</a></li>
  <li><a routerLink="path3" routerLinkActive="active">Item1</a></li>
 <router-outlet></router-outlet>
</ul>

Here is repro 导航到 path1?param1=1&param1=3，它将显示值并突出显示活动 url