我如何在 ngfor 中使用 if 语句？

Question

我有一个由 5 个按钮组成的循环，我想禁用第二个按钮，所以我尝试在 *ngFor 中使用 *ngIf，但它对我来说无法正常工作。你能帮助我吗？谢谢！

<div *ngFor="let day of days">
  <div *ngIf="day == dayFinished ">
    <ion-button id={{day}} expand="block" size="large (click)="test(day)"ngDefaultControl [(ngModel)]="days"  disabled >DAY {{day}}</ionbutton>
  </div>
</div>

Answer 1

您可以在 ngFor 中使用索引。

这是你可以做的方法

<div *ngFor="let day of days; let i=index">
<div *ngIf="day == dayFinished ">
  <ion-button id={{day}} expand="block" size="large (click)="test(day)"ngDefaultControl [(ngModel)]="days"  [disabled]="i==1" >DAY {{day}}</ionbutton>
</div>

index 总是从 0 开始所以检查 i==1

Answer 2

你可以在 ngFor 中使用函数而不是像这样的数组

在你的 html=>

<div *ngFor="let day of filterDays()">
  <ion-button id={{day}} expand="block" size="large (click)="test(day)"ngDefaultControl [(ngModel)]="days" disabled >DAY {{day}}</ionbutton>

在你的组件中=>

filterDays(){
  return days.filter(x => x.day == "dayFinished");
}

Answer 3

你可以试试这个

如果你想禁用循环中的第二个按钮那么你可以设置i==1（因为索引总是从0开始）

<div *ngFor="let day of days; let i=index">
<div *ngIf="day == dayFinished ">
  <ion-button id={{day}} expand="block" size="large (click)="test(day)" ngDefaultControl [(ngModel)]="days" [disabled]="i==1" >DAY {{day}}</ionbutton>
</div>

我希望这会有用

我如何在 ngfor 中使用 if 语句？

How can i use the if statement in ngfor?

angular

ngfor