Question

我有以下 mat-table，每条记录都有编辑和删除按钮：

Name   |   Operation     |
-------|-----------------|
Bob    |   Edit | Delete |
John   |   Edit | Delete |
Willy  |   Edit | Delete |

我使用的mat-table结构如下图：

<ng-container matColumnDef="operation">
    <th mat-header-cell *matHeaderCellDef>Operation</th>
    <td mat-cell *matCellDef="let row">
      <ng-container *ngFor="let operation of operations">
        <button [disabled]="row.isActive">
          <mat-icon>{{ operation.icon }}</mat-icon>
        </button>
      </ng-container>
    </td>
</ng-container>

我想通过从父组件发送参数（“operation.isDisabled”）并在每行中使用列值（“row.isActive”）来启用/禁用删除按钮。但是，由于它是基表，我不想使用特定值并尝试通过“操作”变量在配置中发送这两个条件的boty，例如 operation.condition = "row.isActive && operation.type === 'delete '”。但不幸的是我无法通过以下配置来做到这一点（我可以通过配置，没有问题。但我需要在 if 条件下进行）：

this.operation = [
  {
    type: 'delete',
    condition: 'row.isActive && operation.type === "delete"'
  }
];

那么，是否可以使用从父组件作为字符串等发送的这两个条件来操作单个按钮？

Answer 1

您可以使用回调来验证它。

喜欢： <button [disabled]="check(operation.type, row.isActive)">

并且在 check() 回调中执行所需的评估。

如何有条件地设置Angular Material mat-table单元？

1 个答案: