Angular ngFor 可观察添加 select 值

Question

我有一个像

这样的 ngFo 循环

<mat-option *ngFor="let checklist of filterChecklist | async" [value]="checklist.checklistName" (click)="filterList(checklist.checklistName)">
              <span>{{ checklist.checklistName }}</span>
            </mat-option>

我想在顶部添加一个项目，例如 'ALL' 或 'Select'

我在 .ts 中的代码是

filterChecklist: any;
    this.filterChecklist = this.dataSharingService.filters();

高于观察结果

我该怎么做，请指教。

谢谢

Answer 1

也许我不明白你需要什么但是

只需像这样在您的 ngFO 之前添加 <mat-option>ALL</mat-option>？

<mat-option>ALL</mat-option>
<mat-option *ngFor="let checklist of filterChecklist | async" [value]="checklist.checklistName" (click)="filterList(checklist.checklistName)">
              <span>{{ checklist.checklistName }}</span>
</mat-option>

Angular ngFor 可观察添加 select 值

Angular ngFor with observable add select value

observable

ngfor

angular

google-cloud-firestore