ngModel 不能使用带有本机复选框的primeng 表答案

【问题标题】：ngModel doesn't work using primeng table with native checkboxngModel 不能使用带有本机复选框的primeng 表
【发布时间】：2020-03-15 18:24:48
【问题描述】：

我正在使用带有原生复选框和 ngModel 的 Primeng 可编辑表。

<p-table id="resultTable" [columns]="cols" [value]="results" [rowTrackBy]="trackByFunction" 
scrollable="true" selectionMode="single" [selection]="selected" (onRowSelect)="onRowSelect($event.data)">
  ...
  <ng-template pTemplate="body" let-rowData let-rowIndex="rowIndex">
    <tr [pSelectableRow]="rowData">
      ...
      <td>
        <div class="text-center">
          <input type="checkbox" [(ngModel)]="rowData.active">
        </div>
      </td>
      ...
    </tr>
  </ng-template>
  ...
</p-table>

不知何故，[(ngModel)] 不起作用，我只能获取rowData.active 的值，但是当我单击复选框时，事件绑定不起作用，单击后值没有改变。

有人知道为什么吗？

【问题讨论】：

标签： angular checkbox angular-ngmodel primeng-datatable ngmodel

【解决方案1】：

请使用change事件尝试这种方式

<input type="checkbox" [(ngModel)]="isChecked" (change)="checkValue(isChecked?'A':'B')" />

checkValue(event: any){
  console.log(event);
 }

这是一个代码 link

【讨论】：

添加（更改）后无法点击复选框。
请检查我在 ans stackblitz.com/edit/angular-e795lx 中添加的链接
是的，但没有打印出来。重要的是我在primeng可编辑表中使用复选框。我试过你的方法，没有任何显示

【解决方案2】：

[(ngModel)] 在多种情况下都不是很稳定。有时它会立即起作用，有时它需要一些时间。正确的方法是使用 [(ngModel)] 和 (ngModelChange)

<input type="checkbox" [(ngModel)]="rowData.active" (ngModelChange)="fun(rowData)">

应该注意：

如果(ngModelChange)在[(ngModel)]前面，则获取更改前的值，否则获取更改后的值

【讨论】：