'checked' 和 (ngModel) 有什么区别

Question

所以我继承了一个从ionic3到ionic4的不完全移植的项目。在更新一些 <ion-checkbox> 个实例时，我不得不更改：

  <ion-checkbox 
    checked="selected.get(request.id)" 
    (click)="selectItem(request.id)" 
    color="tertiary" 
    slot="start"
  >

至：

  <ion-checkbox 
    (ngModel)="selected.get(request.id)" 
    (click)="selectItem(request.id)" 
    color="tertiary" 
    slot="start"
  >

让它正确切换。 checked 的使用导致它每次在第一次点击时都失败，并且从该点向前反转值。

在这种情况下 (ngModel) 到底在做什么？这基本上是 ionic docs 中显示的未记录的功能，没有解释或示例使用...

请注意 selected 是一个 Map<number, boolean> 并且在同一视图中其他地方使用该 bool 值按预期工作。

编辑：我知道 HTML 属性和 ng 数据模型之间的区别，我只是不清楚这里的机制是如何工作的...

Answer 1

在高层次上，checked 属于 HTML 而 ngModel 属于 Angular。

[选中]

checked 是复选框的 HTML 属性，在 angular 中，您可以使用以下代码设置复选框的选中属性。

[checked]="item.checked"

[(ngModel)]

[(ngModel)] 是一个 Angular 属性用于双向绑定，这意味着您在 .ts 文件中所做的任何更改都会反映在您的视图中，反之亦然以及。 More info

[(ngModel)]="item.checked"

现在，你什么时候用这些？ [checked] 当您的要求只是设置元素的选中属性时使用，而您使用 [(ngModel)] 将元素值绑定到 .ts 文件中的变量这样您就可以访问它以了解背后的逻辑。

What's the difference between 'checked' and (ngModel)