如何在 angular 12 的点击事件中启用在新选项卡中打开 link

Question

我的点击事件：

html:
 <div class="image"   (click)="onClickOperation(product);">
.......
</div>
TS:
onClickOperation(product: any): void {
    // debugger
    if (this.regularView) {
      if (this.details) {
        this.openLightbox(product);
      } else {
        this.router.navigate(['/product', product.productId]);
      }
    } else {
      this.router.navigate(['/store', product.shopId]);
      this.productsender.changeMessage(product);
    }
  }

它工作正常我想如何实现右键单击以在新选项卡选项中打开 link。我该怎么做需要

Answer 1

如果您的意思是您希望能够通过 right-click 菜单打开 link，那么您需要将 routerLink 传递给 a 标签。有解决办法：

还有一个例子：

<a routerLink="/user/bob">link to user component</a>

或

<a [routerLink]="['/user/jim']">Jim</a>

您需要“a”标签，因为在 HTML 中只有此标签具有属性以通过 HTML 功能打开 links。

有关如何使用 routerLink 的信息，您可以在 angular routerLink docs

中找到

在您的情况下，您可能应该使用 *ngIf 创建条件以显示具有正确 URL 的正确元素。

有一个制作方法的例子。

如果你想用你的功能替换上下文菜单，看看这个问题：

如何在 angular 12 的点击事件中启用在新选项卡中打开 link

How to enable open link in new tab in click event in angular 12

navigation

router

angular