上下文菜单事件会打开默认的上下文菜单并触发该事件

Question

当我右键单击一个对象时，我正在尝试打开菜单。 我的代码是：

<div class="component-div" fxLayout="column" fXLayoutAlign="center space-between" (contextmenu)="onRightClick($event)">        
  <div class="header-title">
      <button mat-button class="xs-btn" (click)="addObject()">Add Object</button>
      <button mat-button class="xs-btn" (click)="addBranch()">Add Branch</button>
      <button mat-button class="xs-btn" (click)="addLabel()">Add Label</button>
      <button mat-button class="xs-btn" (click)="addText()">Add Text</button>
   </div>

<div class="content-div" #graphContainer id="graphContainer" (contextmenu)="onRightClick($event)">
      <button mat-button [matMenuTriggerFor]="menu" id="menuBtn" style="display:none;"></button>
      <mat-menu #menu="matMenu" (close)="onMenuClosed()">
          <button class="menuOpnBtn" mat-menu-item *ngFor="let opn of addTextToOpns" (click)="editCell(opn)">
              {{ opn }}
          </button>
      </mat-menu>
</div>
</div>

它看起来像这样： 可以打开Mat菜单，但也可以使用默认菜单：

我将不胜感激。

我有另一个问题：我怎么知道菜单所指的是哪个项目？

Tx

Answer 1

Mat-menu is a floating panel containing list of options。要打开mat-menu，不可以单击鼠标右键。由于这是一个简单的下拉列表，因此只能单击鼠标左键。

如果您使用Context menu，则可以实现所需的条件

  

https://www.primefaces.org/primeng/#/contextmenu

Answer 2

我找到了！ 所有需要做的就是添加：

event.preventDefault();

在onRightClick（event：any）方法中。