问角:两个如何在一个HTML中打开两个垫菜单？

EN

(this is first menu)
<mat-icon style="cursor: pointer;" [matMenuTriggerFor]="menu">more_vert   
  <mat-menu #menu="matMenu"> 
    <button mat-menu-item (click)="addNewItem()">New Folder</button>
    <button mat-menu-item (click)="uploadFiles()">Upload Files</button>
  </mat-menu> 
</mat-icon>

(This is second menu)

<mat-card *ngFor="let imagespayload of uploadedImagesObj"(click)="activeFolder=imagespayload"
   (contextmenu)="onContextMenu($event, imagespayload)">

   <div style="position: fixed"
     [style.left]="contextMenuPosition.x"
     [style.top]="contextMenuPosition.y"
     [matMenuTriggerFor]="contextMenu"
     [matMenuTriggerData]="{item: imagespayload}">
   </div>

  <mat-menu #contextMenu="matMenu">
    <ng-template matMenuContent let-item="item">
      <button mat-menu-item>Action 1</button>
      <button mat-menu-item>Action 2</button>
    </ng-template>
  </mat-menu>

  import { Component, OnInit, Input,ViewChild } from '@angular/core';
  import { MatMenuTrigger } from '@angular/material';

  @ViewChild(MatMenuTrigger) contextMenu: MatMenuTrigger;
  contextMenuPosition = { x: '0px', y: '0px' };

 onContextMenu(event: MouseEvent, imagespayload) {
   event.preventDefault();
   this.contextMenuPosition.x = event.clientX + 'px';
   this.contextMenuPosition.y = event.clientY + 'px';
   this.contextMenu.menuData = { imagespayload};
   this.contextMenu.openMenu();
}