2017-08-21 3 views
0

Der Code Link lautet: https://plnkr.co/edit/V9ZkLzDeVo15ngIu2Glo?p=previewAngular PrimeNG Table sortieren

Meine Vorlage ist:

<p-dataTable [value]="cars"> 
<p-headerColumnGroup> 
    <p-row> 
     <p-column header="Vin" rowspan="2" [sortable]="true"></p-column> 
     <p-column header="Info" colspan="3"></p-column> 
    </p-row> 
    <p-row> 
     <p-column header="Year" [sortable]="true"></p-column> 
     <p-column header="Brand" [sortable]="true"></p-column> 
     <p-column header="Color" [sortable]="true"></p-column> 
    </p-row> 
</p-headerColumnGroup> 
<p-column field="vin"></p-column> 
<p-column field="year"></p-column> 
<p-column field="brand"></p-column> 
<p-column field="color"></p-column> 

Die Sortierfunktion wird nicht funktionieren, wenn es eine colgroup Header ist. Kann mir bitte jemand dazu vorschlagen?

Antwort

2

Das liegt daran, p-dataTable konnte keine Verbindungen zwischen Kopfzeilen und Spalten finden. Das Hinzufügen von sortField zur Kopfzeile hilft beim Erstellen:

<p-headerColumnGroup> 
    <p-row> 
     <p-column header="Vin" sortField="vin" rowspan="2" [sortable]="true"></p-column> 
     <p-column header="Info" colspan="3"></p-column> 
    </p-row> 
    <p-row> 
     <p-column header="Year" sortField="year" [sortable]="true"></p-column> 
     <p-column header="Brand" sortField="brand" [sortable]="true"></p-column> 
     <p-column header="Color" sortField="color" [sortable]="true"></p-column> 
    </p-row> 
</p-headerColumnGroup> 
Verwandte Themen