我试图在我的应用程序中实现RouterLink活动，但我面临的问题是，它将类活动设置为多个链接.我就是这么做的
<ul class="nav nav-tabs">
<li role="presentation" [routerLinkActive]="['active']"><a [routerLink]="['/']">Home</a></li>
<li role="presentation" [routerLinkActive]="['active']"><a [routerLink]="['/about']">About</a></li>
<li role="presentation" [routerLinkActive]="['active']"><a [routerLink]="['/contact']" >Contact Us</a></li>
</ul>
这是它的样子
Here it's how it look in dev-tools
And my address bar
try 将[routerLinkActiveOptions]="{exact: true}"设置为HTML，如下所示:
<ul class="nav nav-tabs">
<li role="presentation" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}"><a [routerLink]="['/']">Home</a></li>
<li role="presentation" routerLinkActive="active"><a [routerLink]="['/about']">About</a></li>
<li role="presentation" routerLinkActive="active"><a [routerLink]="['/contact']" >Contact Us</a></li>
</ul>
RouterLinkActive确实会将当前路由分块，并try 将其部分与您提供的RouterLink进行匹配.考虑到这一点，路由/将在任何地方匹配，因为它是所有其他路由的父路由(如/about、/contact等，因为它由/+route-path组成).为了简单起见，它不是bug，有时它是您的应用程序中匹配多个路由所需的功能.为防止出现这种情况，您可以指定routerLinkActiveOptions与您所在的路由完全匹配.这意味着它不会与父路由匹配，而只会try 查找为此路由提供的routerLink.