Question

我正在使用材料表来显示我的阵列。我想为用户提供一个选项，以便当他勾选“每日”时，它仅显示file_name的倒数第5个字符等于“ D”且每月等于“ M”的文件。

<div style="overflow-x:auto;">
  <table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">

    <!-- Unit Column -->
    <ng-container matColumnDef="unit">
      <th mat-header-cell *matHeaderCellDef>Unit</th>
      <td mat-cell *matCellDef="let element"  *ngIf=" file_name.charAt(((apiDataFile.file_name).length) - 5) == 'M'"> {{element.unit}} </td>
    </ng-container>

    <!-- File Name Column -->
    <ng-container matColumnDef="file_name">
      <th mat-header-cell *matHeaderCellDef> File Name</th>
      <td mat-cell *matCellDef="let element" *ngIf=" file_name.charAt(((apiDataFile.file_name).length) - 5) == 'M'"> {{element.file_name}} </td>
    </ng-container>


    <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
    <tr mat-row *matRowDef="let row; columns: displayedColumns;"
        [ngClass]="{highlighted: selectedRowIndex == row.id}"  (click)="highlight(row)" >
    </tr>
  </table>
  <mat-paginator [pageSizeOptions]="[20, 5, 10, 50, 100]" showFirstLastButtons></mat-paginator>

</div>

在我的示例中，我只希望打印每月文件，这意味着从末尾开始的第5个字符等于“ M”，而没有打勾选项。我该如何实现？

Angular仅显示使用* ngIf？遵守特定条件的数组元素。

0 个答案: