如何在离子复选框中使用ngModel

How to use ngModel in ion-checkbox?

本文关键字：ngModel 复选框      更新时间：2023-09-26

我正在尝试与ngModel一起使用，但ngModel在那里不起作用。我的代码：

<ion-checkbox *ngFor="#item of items" [(ngModel)]="item.checked">
  {{item.name}}
</ion-checkbox>

但是我得到一个错误：

例外：表达式"签入 AddInterestItem@5：2"在检查后已更改。以前的值："假"。当前值：[AddInterestItem@5：2] 中的"假"

示例数据：

this.items = [ 
  {name: 'Dancing', checked: false}, 
  {name: 'Jazz', checked: false}, 
  {name: 'Metal', checked: true}, 
  {name: 'Pop', checked: false}, 
  {name: 'Rock''n''Roll', checked: false}, 
  {name: 'Folk Metal', checked: true} 
];

我不熟悉<ion-checkbox>.但是当我试图用正常的方式重复你的故事时 <input type="checkbox" /> ，我无法通过将ngFor直接应用于input type="checkbox"来获得成功。所以我做了什么，我拿了<ul><li *ngFor="#item of items" >，把我的input type="checkbox"放进去，它开始按预期工作。

我觉得MyAnswer可以进一步帮助您。

在我的案例中不起作用 

<input  type="checkbox" *ngFor="#item of items" [(ngModel)]="item.checked" />{{item.name}}  
/* I don't know some error occurs. you can check my plunkr by modifying it/*.

工作正常

    <ul>
        <li *ngFor="#item of items">{{item.name}}
            <input type="checkbox" [(ngModel)]="item.checked" />
        </li>
    </ul>

只是 Ionic 4 的快速更新：

.HTML：

<ion-checkbox [(ngModel)]="iLikeIt.isChecked"></ion-checkbox>

嗡：

iLikeIt={isChecked:false}
相关文章：