如何从Angular Material Table下面的API中显示错误

问题描述 投票:1回答:1

我面临以下问题。

我想从API中显示适用于整个表格的错误。在我的情况下,我想显示表没有行的错误。我可以使用mat-error呈现错误,但是当我填充它时,错误不会隐藏。我希望显示和隐藏的错误类似于库存控制中的错误(例如:mat-input)。

在我的html代码下面。

<mat-form-field color="accent" class="col-lg-4 col-xs-12 col-sm-12">
  <input matInput name="name" ngModel #name="ngModel" placeholder="Name">
  <mat-error *ngIf="name.invalid">{{name.errors.api}}</mat-error>
</mat-form-field>
<input type="hidden" name="converters" [ngModel]="converterItems.data" #converters="ngModel">
<table mat-table [dataSource]="converterItems" name="converters">
  <ng-container matColumnDef="select">
    <th mat-header-cell *matHeaderCellDef>
    </th>
    <td mat-cell *matCellDef="let row">
      <mat-checkbox (change)="$event ? selection.toggle(row) : null" [checked]="selection.isSelected(row)">
      </mat-checkbox>
    </td>
  </ng-container>
  <ng-container matColumnDef="key">
    <th mat-header-cell *matHeaderCellDef> Key </th>
    <td mat-cell *matCellDef="let element"> {{element.key}} </td>
  </ng-container>
  <ng-container matColumnDef="typeName">
    <th mat-header-cell *matHeaderCellDef> Type name </th>
    <td mat-cell *matCellDef="let element"> {{element.typeName}} </td>
  </ng-container>
  <tr mat-header-row *matHeaderRowDef="displayedColumnsConverters"></tr>
  <tr [@rowsAnimation]="" mat-row *matRowDef="let row; columns: displayedColumnsConverters;" (click)="select(row)"
      [ngClass]="{ 'selected': row === selectedRow }"></tr>
</table>
<mat-error *ngIf="converters.invalid" class="errorTextSize">{{converters.errors.api}}</mat-error>

谢谢您的帮助。

angular angular-material mat-table material-table angular-material-table
1个回答
0
投票

您可以尝试以下代码:

this.appService.getService().subcribe(result => {
    // Do something when the service returns successfully
},
error => {
    // Do something when the service returns with an error like below:
    this.converters.invalid=true;
}

© www.soinside.com 2019 - 2024. All rights reserved.