当任一子链路路由处于活动状态angular2时,如何将元素设置为活动状态

Question

我有以下代码片段用于生成nav-taps带有嵌入式下拉列表的引导程序:

    <ul class="nav nav-tabs">
      <li class="pull-right">
        <a class="dropdown-toggle" data-toggle="dropdown"> More <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a [routerLink]="['/profile/settings']">Settings</a></li>
            <li><a [routerLink]="['/profile/billing']">Billing</a></li>
          </ul>
      </li>
      <li class="pull-right" [routerLinkActive]="['active']"><a [routerLink]="['/profile/feature1']">Feature1</a></li>
      <li class="pull-right" [routerLinkActive]="['active']"><a [routerLink]="['/profile/feature2']">Feature2</a></li>
    </ul>

这适用于普通选项卡,但我无法弄清楚当任一嵌入式链接处于活动状态时如何使下拉列表处于活动状态.我试过了:

<a [routerLinkActive]="['active']" class="dropdown-toggle" data-toggle="dropdown"> More <span class="caret"></span></a>

但它似乎没有解决任何问题,任何人都知道如何做到这一点？

Answer 1

我是哑巴,并试图把[routerLinkActive]上<a>代替元素<li>.一旦我把它放在最顶端li它就像一个魅力!

<ul class="nav nav-tabs">
  <li class="pull-right" [routerLinkActive]="['active']">
    <a class="dropdown-toggle" data-toggle="dropdown"> More <span class="caret"></span></a>
      <ul class="dropdown-menu">
        <li><a [routerLink]="['/profile/settings']">Settings</a></li>
        <li><a [routerLink]="['/profile/billing']">Billing</a></li>
      </ul>
  </li>
  <li class="pull-right" [routerLinkActive]="['active']"><a [routerLink]="['/profile/feature1']">Feature1</a></li>
  <li class="pull-right" [routerLinkActive]="['active']"><a [routerLink]="['/profile/feature2']">Feature2</a></li>
</ul>