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

时间:2018-10-12 09:35:11

标签: angular angular-material

我正在使用table组件,我想在table component的最后一行中放置menu按钮,如下所示: enter image description here

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

1 个答案:

答案 0 :(得分: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>

结果:

enter image description here