Angular 2:检查routeName是否是当前的

时间:2016-04-25 12:38:52

标签: javascript typescript angular router

我正在使用Angular 2进行项目,而我正面临一个问题。 我已经创建了一个链接组件,我可以像这样使用它:

<cmp-link [routeName]="['Channel/Add']">Add channel</cmp-link>

此组件检查当前路由是否与通过参数传递的路由相同,如果是,则应用类。如何检查当前网址是否与routeName提供的网址相同?嗯,这太丑了。

this.isCurrentRoute = this.normalize(currentUrl) === this.routeName[0].toLowerCase();
你不喜欢它吗?我也不。我想检查当前是否使用它的名称激活路线。

(在这种情况下,Channel/Add是路线名称。)

我不知道如何使用路线名称来做这个。我查看了RouterInstruction

1 个答案:

答案 0 :(得分:2)

旧路由器实施的解决方案

我认为这可以做到这一点:

router.isRouteActive(router.generate(['Home']))

这不是一个非常好的解决方案,但是我唯一知道的解决方案。

router.isRouteActive想要Instruction并且无法管理字符串本身,因此您需要使用Instruction生成此router.generate()

来源:https://angular.io/docs/ts/latest/api/router/Router-class.html

注意

正如@ClémentFlodrops所提到的,这只适用于平面路由结构。据我所知,目前无法很好地存档。

也许可以使用_childeRouter的私有Router,但要访问此属性,我们需要覆盖Router - 类。

所以我建议等一段时间,也许路由器会支持这个操作一次。

编辑:新路由器3.0.0-alpha

使用new router,您可以添加routerLinkActive="class",如果routerLink处于活动状态,则会添加该类。

如果routerLink不直接在带有routerLinkActive的标签上,也可以工作:

<li role="menuitem" routerLinkActive="active">
    <a href="" [routerLink]="['/home']" title="home" class="control-icon">
        <span class="fa fa-home"></span>
    </a>
</li>