angular - 验证 mat-table 内的表单字段输入（Angular 7）

Question

我有一个带有 mat-input 的 mat-form-field，它位于一个材料表内。由于数据位于材料表数据源中，因此我无法使用表单组并以这种方式验证输入。有没有其他方法或“解决方法”可以用来解决这个问题？

字段设置如下：

<ng-container matColumnDef="rate">
  <mat-header-cell *matHeaderCellDef mat-sort-header>Currency rate</mat-header-cell>
  <mat-cell class="description-cell" *matCellDef="let data">
    <mat-form-field class="rate-form-field">
      <input matInput [value]="data.currencyRate" (focusin)="setValue(data.currencyRate)" (focusout)="checkDirty($event, data)"  placeholder="Rate">
    </mat-form-field>
  </mat-cell>
</ng-container>

该值直接从材料表数据源绑定。在 focusin 上我保存当前值，在 focusout 上我检查保存的值与输入字段中的实际值。如果不同，我更改数据源中的值。我想要实现的是，当它为空和/或无效数字/字母时，我尝试保存，它应该在表单字段下方引发错误。

标签： angularangular-materialangular7