Angular mat table - 让点击事件正常工作

Question

我想在 Angular 应用程序中选择垫子表的一个项目（行）。因此我使用角度材质。我想我不知道添加（点击）事件的正确位置，还是我必须以其他方式执行此操作？感谢您的帮助！

<div class="table-container mat-elevation-z8">
  <mat-table #table [dataSource]="dataSource" matSort>

    <ng-container matColumnDef="item_id">
      <mat-header-cell *matHeaderCellDef mat-sort-header> ID </mat-header-cell>
      <mat-cell *matCellDef="let item"> {{item.id}} </mat-cell>
    </ng-container>

    <ng-container matColumnDef="item_name">
      <mat-header-cell *matHeaderCellDef mat-sort-header> Name </mat-header-cell>
      <mat-cell *matCellDef="let item" (click)="onSelect(item)"> {{item.name}} </mat-cell>
    </ng-container>

    <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
    <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
  </mat-table>
</div>

该示例不起作用。

Answer 1

就这样尝试一下

<ng-container matColumnDef="position">
  <mat-header-cell *matHeaderCellDef> No. </mat-header-cell>
  <mat-cell *matCellDef="let element" (click) = "click('aaa')" > {{element.position}} </mat-cell>
</ng-container>

工作中的 Plunker 链接

单击表格的第一列