Question

我有一个带有复选框的表单，对于某些复选框，适用以下条件：

当选中一个复选框并被单击并且某些语句为true时，则该复选框不应未被选中，而应跳回到选中状态。

这是当前的html：

<ion-item>
    <ion-label stacked  [innerHTML]="htmlString"></ion-label>
    <ion-checkbox (click)="checkboxClick($event)"></ion-checkbox>
  </ion-item>

这是当前的.ts：

checkboxClick(e){
    var statement = true;

    if(statement){
    e.target.checked = true;
    }
  }

这是一个展示问题的堆叠式炸弹：https://stackblitz.com/edit/ionic-tcxd55?file=pages%2Fhome%2Fhome.ts

Answer 1

使用（ionChange）代替（click）

html

<ion-checkbox (ionChange)="checkboxClick($event)" checked></ion-checkbox>

ts

  checkboxClick(e){
    var statement = true;
    if(statement){
      e.checked = true;
    }
  }

Answer 2

我看不到堆栈闪电与您的问题有什么关系，但是在这里我看到您拼错了“目标”：

  if(statement){
    e.target.checked = true;
    }

Answer 3

以下为我工作

HTML：

<ion-item>
     <ion-label>Enable Face Plotting (More Processor intensive)</ion-label>
     <ion-checkbox color="danger" checked="{{facePlottingOption}}" (ionChange)="checkboxFacePlotting($event)">
     </ion-checkbox>
 </ion-item>

.TS 文件：

export class TabCapturePage {
facePlottingOption: boolean = false;

public checkboxFacePlotting(e) {
    if (e.currentTarget.checked) {
      console.log("=========FACE PLOTTING ENABLED");
      this.facePlottingOption = true;
    } else {
      console.log("=========FACE PLOTTING DISABLED");
      this.facePlottingOption = false;
    }
  }
}

Ionic：如果满足特定条件，请在事件处理程序中选中此复选框

3 个答案: