Angular 2:动态生成链接的Active Router链接和routerLinkActiveOptions

4rp*_*pit 5 javascript angularjs angular2-routing angular

我有一个使用列表标签创建的菜单我想使用routerLinkActiveOptions这样的一个子routerLink激活时将类应用于父标签

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

它的工作正常但是当我使用数据数组为动态生成的菜单尝试相同时它不起作用.相同的代码是

 <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>
Run Code Online (Sandbox Code Playgroud)

如何实现这一点,任何帮助?

ran*_*al9 7

您需要按照设置[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>
Run Code Online (Sandbox Code Playgroud)