angular - 通过函数调用使用 routerLink

Question

我正在尝试将 routerLink 与以下函数一起使用:

<a class="nav-link" [routerLink]="callHome(data)">Home </a>

callHome(data){
   //perform some operations
   this.router.navigate(["/home"]);
}

这里的问题是，每当我刷新页面时，甚至无需单击Home，它就会自动导航到/home。

我尝试的另一种选择是:

<a class="nav-link" [routerLink]="['/home']">Home </a>

在这里，虽然它可以工作，但我无法在导航之前进行操作。

我无法使用按钮并使用(点击)，因为我也希望将其作为链接。如果我使用按钮，链接就会消失。

如何将 [routerLink] 与函数调用一起使用？

Answer 1

您应该能够在链接元素上放置一个(click) 处理程序。

<a class="nav-link" [routerLink]="['/home']" (click)="doSomeLogic()">Home</a>

它应该在使用路由器链接导航之前执行(点击)处理程序。