javascript – 将CSS应用于活动路由器链接[Angular 2]

我想将特殊的CSS样式属性应用于活动路由器链接:

<a [routerLink]='link'>{{name}}</a>

这是我到目前为止尝试的(使用默认的router-link-active类):

.router-link-active {
	color: #000;
	font-weight: bold;
}

它不起作用,我真的不明白为什么.

解决方法:

目前Angular 2有一个built in attribute,你可以在任何与[routerLink]一起使用的链接上使用它是routerLinkActive所以你需要做的就是:

<a [routerLink]='link' routerLinkActive="router-link-active">{{name}}</a>

然后它将识别哪条路由是当前活动路由并应用您的router-link-active类.

注意:

对于那些在标签以外的标签上使用routerLink的人(我个人在按钮上使用它),routerLinkActive不起作用但应该在下一个版本的路由器上工作 – https://github.com/angular/angular/issues/9755

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐