我正在嘗試使用復選框進行簡單的雙向系結，但由于某種原因，它無法正常作業。已嘗試搜索問題，但我的代碼與其他人建議的代碼相同，但它對我不起作用，我似乎看不出任何錯誤。
我在 .ts 中的代碼
@Component({
selector: 'app-investigation',
templateUrl: './investigation.component.html',
styleUrls: ['./investigation.component.scss'],
})
export class InvestigationComponent implements OnInit {
iopa:boolean = true;
constructor() { }
ngOnInit() {}
onIOPAChange() {
console.log(this.iopa);
}
}
html模板
<ion-list>
<ion-item >
<ion-label>IOPA</ion-label>
<ion-checkbox slot="start" [(ngModel)]="iopa" ngDefaultControl>
</ion-checkbox>
</ion-item>
</ion-list>
當我選中或取消選中該復選框時，即使我已將其設定為 true，我也沒有看到“iopa”中的值發生變化，但在加載時未選中該復選框。
謝謝
uj5u.com熱心網友回復：
在 html 中：
<ion-checkbox slot="start" [(ngModel)]="iopa" (ionChange)="onIOPAChange($event)"></ion-checkbox>
在 ts 類中：
onIOPAChange(ev: CustomEvent) {
// CustomEvent can be changed to any but for better code complete we use it
// this.ioap should give undefined here since change event fires before ngModel saves the value into the variable so in order to keep up to date with checkbox if checked or not , u can use this value of ev.target.value and do your work...
console.log(ev.target.value);
}
如果您只需要一次使用復選框值（插入而不編輯...），那么您可以洗掉選中的屬性，因為它的主要目的是使復選框處于選中狀態，以防“this.iopa”為真...
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/337148.html
上一篇：在頁面之間的離子中檢索資料