javascript - Angular 2 : Active Router link and routerLinkActiveOptions for dynamically generated links

我有一个使用列表标签创建的菜单，我想在使用routerLinkActiveOptions这样的一个子routerLink处于事件状态时将一个类应用于父标签

 <ul class="treeview-menu" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
      <li>
        <a class="pointer" [routerLinkActive]="['linkActive']" routerLink="/list/val">
             Link
         </a>
      </li>
    </ul>

效果很好，但是当我尝试使用数据数组对动态生成的菜单进行相同操作时，它不起作用。相同的代码是

 <ul class="treeview-menu" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
      <li *ngFor="let d of data">
        <a class="pointer" [routerLinkActive]="['linkActive']" routerLink="/list/{{d.val}}">
          {{d.name}}
        </a>
      </li>
    </ul>

如何做到这一点，有帮助吗？

最佳答案

您需要像设置[routerLinkActive]="['linkActive']"一样设置routerLinkActive="active":

<ul class="treeview-menu" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
  <li *ngFor="let d of data">
    <a class="pointer" routerLinkActive="linkActive" routerLink="/list/{{d.val}}">
      {{d.name}}
    </a>
  </li>
</ul>