离子 2 禁用列表中的特定按钮

Question

我有一个由 *ngfor 生成的列表，每个项目内部都有一个按钮。我只想禁用 1 个项目按钮，当我尝试禁用一个按钮时，每个项目中的所有按钮都会被禁用。

。.html

<ion-item *ngFor="let item of list">
          <button color="app ionbutton (click)="disable()" [disabled]="isDisabled">button</button>
         </ion-item>

.ts

isDisabled=false;
disable(){this.isDisabled=true;}

Answer 1

所有按钮都绑定到同一个变量，所以是的，它们都将被禁用。要解决您的问题，您可以将值绑定到项目的属性：

list : any[] = [{itemId : 1, disabled : false},{itemId : 2, disabled : false},{itemId : 3, disabled : false}]
constructor(){}
disable(item) {
  item.disable = true;
}   

在您的模板中：

<ion-item *ngFor="let item of list">
          <button color="app ionbutton (click)="disable(item)" [disabled]="item.disabled">button</button>
</ion-item>