草庐IT

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

coder 2025-03-14 原文

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

 <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="active" 一样设置 [routerLinkActive]="['linkActive']":

<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>

关于javascript - Angular 2 : Active Router link and routerLinkActiveOptions for dynamically generated links,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39675825/

有关javascript - Angular 2 : Active Router link and routerLinkActiveOptions for dynamically generated links的更多相关文章

随机推荐