ngModel 无法使用带有本机复选框的 primeng table

Question

我正在使用带有本机复选框和 ngModel 的 primeng editable table。

<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 的值，但是当我单击复选框时，事件绑定不起作用，值没有单击后更改。

有人知道为什么吗？

Answer 1

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

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

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

这是一个代码 link

Answer 2

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

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

应该注意：

如果(ngModelChange)在[(ngModel)]前面，则取变化前的值，否则取变化后的值

ngModel 无法使用带有本机复选框的 primeng table

ngModel doesn't work using primeng table with native checkbox

checkbox

angular-ngmodel

ngmodel

angular

primeng-datatable