在角5中使用RouterLink时，是否有任何方法禁用/防止“打开新选项卡/窗口”的选项？
我有一个单独的页面应用程序，并且使用锚标记()中的RouterLink导航到其他页面，而不需要刷新。
<ul class="menu">
<li *ngIf="isContain(adminFilterMenuItems, 'Setup')">
<a id="NavSetupButton" routerLink="/setup">
<img alt="Setup" src="./assets/images/Setup.png" />
</a>
</li>
</ul>我需要在右键上禁用一些选项，如“打开一个新选项卡”、“打开一个新窗口”等，而不是禁用整个上下文菜单，我需要上下文菜单。
我已经注意到，当我不使用RouterLink并实现其他逻辑导航时，我没有在右击中看到这些选项，这是我想要的。但是我使用的是RouterLink，并且不想为了这样的需求而搅乱整个应用程序。
在使用RouterLink进行导航时，是否可以在右键单击时禁用一些上下文菜单选项？
回答 4
Stack Overflow用户
发布于 2020-02-13 02:36:58
我找到了一个适合我的解决办法。我没有使用RouterLink，而是调用click事件并编写了一个方法"navigateTo"，因此这个单击事件将调用我的"navigateTo“方法，该方法将完成页面导航的工作。
HTML文件
<ul class="menu">
<li *ngIf="isContain(adminFilterMenuItems, 'Setup')">
<a id="NavSetupButton" (click)="navigateTo('/setup')">
<img alt="Setup" src="./assets/images/Setup.png" />
</a>
</li>
</ul>component.ts
navigateTo(component) {
this.router.navigate([component]);
}Stack Overflow用户
发布于 2020-02-10 05:57:27
右击中的选项列表称为上下文菜单。有多种方法来禁用它。前面提到的答案(oncontextmenu="return false;")是一个优雅的解决方案。
然而，由于这是一个与角度相关的问题，让我们编写一个属性指令：
import { Directive, HostListener } from '@angular/core';
@Directive({
selector: '[appDisableRightClick]'
})
export class DisableRightClickDirective {
@HostListener('contextmenu', ['$event']) onContextMenu($event: any) {
$event.preventDefault();
}
}现在可以使用[routerLink]指令将其传递给锚标记。就像。
<a routerLink="sample" appDisableRightClick>About</a>在StackBlitz应用程序中，对于“关于”和“服务”的链接禁用上下文菜单，而链接“测试”是不修改的。
解释性：HostListener装饰器声明要侦听的DOM事件，并提供了事件处理的方法。我们监听contextmenu事件，该事件通常是在单击鼠标右键或上下文菜单键时触发的。在实现中，调用事件的preventDefault()方法，该方法告诉浏览器不应该像通常那样采取默认操作。在我们的例子中，它禁止打开上下文菜单。
应用程序从这里分叉。
Stack Overflow用户
发布于 2020-02-10 02:28:57
请您在锚上尝试oncontextmenu事件，如下面的示例所示。
<a href="https://www.google.com" oncontextmenu="return false;"> Link </a>
https://stackoverflow.com/questions/60148376
复制
腾讯云开发者
