remove item from PrimeNG data table

Question

I am trying to remove an item from a binding list:

<p-dataTable [value]="items">
   <p-column styleClass="col-button">
      <template let-item="rowData" pTemplate="body">
         <button type="button" pButton (click)="remove(item)" icon="fa-remove"></button>
   </template>
</p-column>
            <p-column *ngFor="let item of settings.columns">
                <template let-row="rowData" let-rowIndex="rowIndex" pTemplate="body">
                    <input [type]="item.type" [(ngModel)]="row[item.field]"  class="form-control" [placeholder]="item.title">
                </template>
            </p-column>
        </p-dataTable>

remove(data){
    this.items.splice(this.items.indexOf(data), 1);
}

The item is removed from the items collection, but the table is always removing the last one.

What am I doing incorrectly?

Answer 1

OK, this is a bug with primeNG 1.1.2 . There is a solution from github:

I've fixed it in my project with custom rowTrackBy

rowTrackBy(index: number, row: any) { return row.id; }

Just mapped it to corresponded property of p-dataTable

[rowTrackBy]="rowTrackBy"

thenks for NikitaForm .

https://github.com/primefaces/primeng/issues/1679