I'm trying to sort a column that has template. My understing is that when a column uses a template, the sorting should be done by responding to the sorting event.
<p-column field="activityName" [sortable]="true" (onSort)="onNameSorting($event)">
<ng-template let-col let-activity="rowData" pTemplate="body">
//..
</ng-template>
</p-column>
However, when I put a breakpoint in the event handler, nothing is happening. Am I missing something?
onNameSorting(e){
debugger; //--> the breakpoint is not being hit
//...
}
Thanks for helping
The breakpoint is being hit, the sorting is being performed. Yet no change is being reflected in the dataTable.
onNameSorting(e, dt){
debugger; //This break point is being hit now.
if(!!e.order && e.order > 0){
this.filteredItems = this.filteredItems
.sort((a, b) => (a.activityName < b.activityName) ? -1 : 1);
}else{
this.filteredItems = this.filteredItems
.sort((a, b) => (a.activityName > b.activityName) ? -1 : 1);
}
}
I am assuming you are using the old prime data-table. In that version there was no (onSort)="onNameSorting($event)"
binding to the p-column
. Move that to the p-dataTable
Ex:-
<p-dataTable scrollable="true" [value]="_rowList" [selectionMode]="selectionMode"
[responsive]="true" (selectionChange)="rowSelectionChange($event)"
(click)="rowSingleClick($event)" (dblclick)="rowDoubleClick($event)" [(selection)]="_selectedEntity"
<!-- refer to the next line, above lines are bunch of attributes -->
(onSort)="sortData($event, dt)"[sortField]="sortField" [sortOrder]="sortOrder" #dt>
<p-column field="activityName">
<ng-template let-col let-activity="rowData" pTemplate="body">
//..
</ng-template>
</p-column>
</p-dataTable>
Suggestion: They have launched the new PrimeNg Turbo table. Its much easier and faster.