angular - 如果 routerLink 具有绑定(bind)，为什么 routerLinkActive 不触发？

Question

在我的应用程序中，有不止一种方法可以路由到特定资源，例如，我有面包屑以便能够更自由地浏览项目层次结构

SectionA > SectionB > SectionC

其中 SectionA 有 id=1 等等。同时，我在侧边菜单中得到一个指向当前所选项目的 routerLink，在上面的示例中，它指向 SectionC (id=3)。我通过在有人点击面包屑时发出事件并将事件中的 id 绑定(bind)到侧边菜单中的 routerLink 来保持这些同步:

<li>
    <a [routerLink]="['/section, section? section.id : 0]" [routerLinkActive]="['active']"></a>
</li>

这样，如果用户离开该组件，他们只需单击侧边菜单中的按钮即可返回到相同状态(而不必从头开始导航到他们的目标部分)。

这实际上工作正常，但是，如果我浏览面包屑(因此使用上面的 section 绑定(bind))routerLinkActive 不会触发，尽管 < em>当前 URL 和侧边菜单按钮上的 URL 相同。

只有当我直接点击侧边菜单按钮时，才会应用 active 类，它不会通过绑定(bind)工作。

它适用于没有参数的 URL(那里没有绑定(bind))，所以我猜这与 Angular 的更改检查有关。

问题是，这是有意为之的行为吗？如果是，我应该怎么做才能让它发挥作用？

Answer 1

复制了这个问题并标记为 wiki，因为我不想获得业力:https://stackoverflow.com/a/40528170/88066

1) 在你的组件中

import {Router} from 'angular2/router';

isActive(instruction: any[]): boolean {
    return this.router.isActive(this.router.createUrlTree(instruction), true);
}

2) 在你的 html 中

<a [class.active]="isActive(['user', currentUser.name])">

Router docs on angular.io