我有一张<p-table>
桌子sortMode="multiple"
。我想在页面首次显示时指定两列作为默认排序。如果我设置 sortMode="single" 它通过指定 sortField="year" [sortOrder]="-1" 选项来工作(例如,标题显示为选中并且列排序)。多列的等价物是什么?
类似的示例代码(取自https://www.primefaces.org/primeng/showcase/#/table/sort)
<h3>Multi Sort with MetaKey</h3>
<p-table [columns]="cols" [value]="cars2" sortMode="multiple">
<ng-template pTemplate="header" let-columns>
<tr>
<th *ngFor="let col of columns" [pSortableColumn]="col.field">
{{col.header}}
<p-sortIcon [field]="col.field"></p-sortIcon>
</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>
export class TableSortDemo implements OnInit {
cars1: Car[];
cars2: Car[];
cars3: Car[];
cols: any[];
constructor(private carService: CarService) { }
ngOnInit() {
this.carService.getCarsSmall().then(cars => this.cars1 = cars);
this.carService.getCarsSmall().then(cars => this.cars2 = cars);
this.carService.getCarsSmall().then(cars => this.cars3 = cars);
this.cols = [
{ field: 'vin', header: 'Vin' },
{ field: 'year', header: 'Year' },
{ field: 'brand', header: 'Brand' },
{ field: 'color', header: 'Color' }
];
}
customSort(event: SortEvent) {
event.data.sort((data1, data2) => {
let value1 = data1[event.field];
let value2 = data2[event.field];
let result = null;
if (value1 == null && value2 != null)
result = -1;
else if (value1 != null && value2 == null)
result = 1;
else if (value1 == null && value2 == null)
result = 0;
else if (typeof value1 === 'string' && typeof value2 === 'string')
result = value1.localeCompare(value2);
else
result = (value1 < value2) ? -1 : (value1 > value2) ? 1 : 0;
return (event.order * result);
});
}
}
我想将默认排序设置为“年份,品牌”
所以它看起来像这样: