Angular 如果routerLink具有绑定,为什么routerLink未激活?
在我的应用程序中,有不止一种方法可以路由到特定的资源,例如,为了能够更自由地在项目层次结构中导航,我获得了面包屑Angular 如果routerLink具有绑定,为什么routerLink未激活?,angular,angular2-routing,angular-template,angular2-router3,Angular,Angular2 Routing,Angular Template,Angular2 Router3,在我的应用程序中,有不止一种方法可以路由到特定的资源,例如,为了能够更自由地在项目层次结构中导航,我获得了面包屑 SectionA > SectionB > SectionC 其中SectionA具有id=1,依此类推。同时,我在侧边菜单中获得了一个指向当前所选项目的routerLink,在上面的示例中,它将指向SectionC(id=3)。我通过在有人单击面包屑时发出事件,然后将事件中的id绑定到我的侧菜单中的routerLink来保持这些同步: <li> &
SectionA > SectionB > SectionC
其中SectionA
具有id=1
,依此类推。同时,我在侧边菜单中获得了一个指向当前所选项目的routerLink
,在上面的示例中,它将指向SectionC
(id=3
)。我通过在有人单击面包屑时发出事件,然后将事件中的id
绑定到我的侧菜单中的routerLink
来保持这些同步:
<li>
<a [routerLink]="['/section, section? section.id : 0]" [routerLinkActive]="['active']"></a>
</li>
这样,如果用户导航离开该组件,他们只需单击侧菜单中的按钮即可返回到相同的状态(而不必从头导航到目标部分)
但是,如果我在面包屑中导航(因此我从上面使用到部分的绑定)routerLinkActive
不会触发,尽管当前URL和侧菜单按钮上的URL相同
只有当我直接单击侧菜单按钮时,才应用了活动的
类,它不会通过绑定工作
它适用于没有参数的URL(这里没有绑定),所以我想这与Angular的更改检查有关
问题是,这种行为是有意为之的吗?如果是,我应该怎么做才能让它发挥作用呢
<a [routerLink]="['/inbox']" class="link" routerLinkActive="active">Inbox</a>
也考虑指定<代码> RoTrLink活动选项< /代码>,如果是这样的话:
复制了这个问题并标记为wiki,因为我不想获得业力:
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])">
很遗憾,这也不起作用,请检查此plnkr-
<a [class.active]="isActive(['user', currentUser.name])">