twitter-bootstrap – 如何在Angular 2中设置Bootstrap navbar“active”类？

如何在Angular 2中设置Bootstrap navbar“active”类？我只发现了 Angular 1 way.

当我转到About页面时,将class =“active”添加到About,并在Home上删除class =“active”.

<ul class="nav navbar-nav">
    <li class="active"><a [routerLink]="['Home']">Home</a></li>
    <li><a [routerLink]="['About']">About</a></li></li>
</ul>

谢谢

解决方法

如果您使用新的3.0.0.组件路由器( https://github.com/angular/vladivostok)您可以使用routerLinkActive指令.无需进一步的JavaScript.

<ul class="nav navbar-nav">
  <li [routerLinkActive]="['active']"> <a [routerLink]="['one']">One</a></li>
  <li [routerLinkActive]="['active']"> <a [routerLink]="['second']">Second</a></li>
</ul>

我使用了“@ angular / router”：“^ 3.0.0-alpha.7”

原文地址：https://www.jb51.cc/bootstrap/234173.html