角度材料将表格行数据传递给菜单项答案

【问题标题】：angular material pass table row data to menu items角度材料将表格行数据传递给菜单项
【发布时间】：2020-05-11 09:46:47
【问题描述】：

我需要将数据从表格行元素传递到菜单，但它只发送 undefined 数据。我像这样使用matMenuTriggerData：

<ng-container matColumnDef="execute">
   <th mat-header-cell fxFlex="8%" fxLayoutAlign="start center" *matHeaderCellDef></th>
   <td mat-cell fxFlex="8%" fxLayoutAlign="start center" *matCellDef="let element">
       <button mat-icon-button [matMenuTriggerFor]="menu" [matMenuTriggerData]="element">
           <i class="material-icons" style="color: #368852">cloud_download</i>
       </button>
   </td>
</ng-container>

和菜单：

<mat-menu #menu="matMenu">
    <ng-template matMenuContent let-aliasMenuItems="element">
  <button mat-menu-item (click)="cl(aliasMenuItems)">
    <mat-icon>dialpad</mat-icon>
    <span>Redial</span>
  </button>
....
</mat-menu>

如果你想看stackblitz

【问题讨论】：

标签： angular angular-material

【解决方案1】：

你应该像这样传递数据 [matMenuTriggerData]="{element: element}"，如果你想要所有的项目。因为当你在访问像let-aliasMenuItems="element" 这样的变量，你是试图访问变量的值而不是变量

如果你想访问变量的值 priorityIndex 那么你可以这样做

[matMenuTriggerData]="element"

和

let-aliasMenuItems="priorityIndex"

Working stackblitz example

【讨论】：