Ionic 2禁用列表内的特定按钮

时间:2017-03-16 20:19:39

标签: angular ionic2

我有一个由* 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;}

1 个答案:

答案 0 :(得分:0)

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

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>