验证是否已在Ionic中选中ion-checkbox

时间:2019-11-02 16:23:38

标签: angular typescript ionic-framework ionic3

我有一个复选框列表,我需要确定何时选中这些项目中的至少一项以启用按钮。

到目前为止,我已经做到了这一点,但是它不适用于event.target.checked,什么也没发生,我也只是尝试了event.checked而没有。

<ion-list>
   <ion-item *ngFor="let option of question.options">
      <ion-label>{{option}}</ion-label>
      <ion-checkbox color="secondary" value="option" (click)="isChecked($event)" name="option"></ion-checkbox>
   </ion-item>
</ion-list>

file.ts:

isChecked(event) {
  if ( event.target.checked ) {
    console.log("Checked!");
    this.btnDisabled = false;
 }
}

离子版本:3.9.5

Angular 5

2 个答案:

答案 0 :(得分:2)

尝试这样:

Working Demo

模板:

<ion-list>
   <ion-item *ngFor="let option of question.options">
      <ion-label>{{option}}</ion-label>
      <ion-checkbox color="secondary" value="option" (click)="onChange(option)" name="option"></ion-checkbox>
   </ion-item>
</ion-list>

<button [disabled]="checkedItems.length <1 ">Save </button>

TS:

 checkedItems = []


 onChange(item) {
    if(this.checkedItems.includes(item)) {
      this.checkedItems = this.checkedItems.filter((value)=>value!=item);

    } else {
      this.checkedItems.push(item)
    }
  }

答案 1 :(得分:1)

使用 ionChange 代替 click ,使用 event.checked 代替 {{1} }

event.target.checked