将菜单组件放置在表的列中

Question

我正在使用table组件，我想在table component的最后一行中放置menu按钮，如下所示：

实际上我已经在第三列中添加了menu按钮，并给了float:right;，但是我想通过创建另一列来在table中添加此按钮。如何做到这一点？ / p>

Answer 1

只需在表格内添加按钮。

在组件上声明一个名为actions的新显示列：

displayedColumns: string[] = [ your_rest_declarations...,'actions'];

然后将其添加到您的视图中：

    <!-- Actions -->
   <ng-container matColumnDef="actions">
    <th mat-header-cell *matHeaderCellDef> Actions </th>
    <td mat-cell *matCellDef="let element"> 
      <button mat-icon-button >
          <mat-icon aria-label="actions">more_vert</mat-icon>
      </button>
    </td>
  </ng-container>

结果：