访问组件类中的[routerLinkActive]值-Java 学习之路

我有一个标签组件TabComponent，它具有以下HTML模板：

<a [routerLink]='link' [routerLinkActive]="[is-active]">link label</a>
<button>Close tab</button>

我想访问[routerLinkActive]属性的值，基本上我想在组件类中获取一个变量，指示此routerLink是否处于活动状态 . 如何从组件类中访问它？

EDIT ：我想如果能够访问 <a> link标签的CSS类，工作就完成了，是否有办法访问它？

2 回答

我不知道这是否会有所帮助，但您可以在模板中获取如下值：

<a *ngFor="let child of directory; let i = index;"
   routerLink="{{child.route}}"
   routerLinkActive #rla="routerLinkActive">

   <h3>{{rla.isActive}}</h3><!--Displays boolean indicating whether or not you are navigated to this link-->
</a>

现在，您的h3中将显示一个布尔值，指示您当前是否已导航到该链接 .

虽然这可以作为模板变量，但我无法将值传递给component.ts或将其传递给其他模板指令，例如

<a *ngFor="let child of directory; let i = index;"
   routerLink="{{child.route}}"
   routerLinkActive #rla="routerLinkActive"

   [active]="rla.isActive" <!--This doesn't insert the boolean here for some reason-->
   >    
   <h3>{{rla.isActive}}</h3>
</a>

我希望这有帮助 . 如果你接近一个好的解决方案，请更新 .

回复于 2024-05-03T21:30:02+08:00

5

你可以使用 @ViewChild() decorator访问routerLinkActive

@ViewChild(RouterLinkActive) private routerLinkActive: RouterLinkActive;

但问题是它的值不是立即设置的，所以对于组件渲染期间的大多数情况， isActive 将为false，只有稍后路由器才会将其设置为true .

回复于 2024-05-03T21:30:02+08:00

访问组件类中的[routerLinkActive]值

2 回答

相关问题