How to sort multiple columns using PrimeNG

0
votes

How can I sort multiple columns while using a p-table, PrimeNG | Angular UI Component Library?

<h3>Multi Sort Columns</h3>
<p-table
  [columns]="cols"
  [value]="cars1"
  [lazy]="lazy"
  [lazyLoadOnInit]="lazyLoadOnInit"
    (onLazyLoad)="loadList($event)"
  [sortMode]="sortMode"
  [multiSortMeta]="multiSortMeta">
    <ng-template pTemplate="header" let-columns>
        <tr>
            <th *ngFor="let col of columns" [pSortableColumn]="col.field">
                {{col.header}}
            </th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-rowData let-columns="columns">
        <tr>
            <td *ngFor="let col of columns">
                {{rowData[col.field]}}
            </td>
        </tr>
    </ng-template>
</p-table>

Can there be a default predefined secondary sort column ?

1
angularsortingprimeng

1 Answers

2
votes

Yes, you can define multiple predefined sorts by using multiSortMeta property.

Here is an example:

[multiSortMeta]="[{field: 'quantity', order: -1}, {field: 'price', order: 1}]"

See demo