I am using primeNg . I want to implement sorting of data. The problem is that I have a column data structure where some columns have a superColumn type and that means they are divided for a set of subColumns. It works well for presenting but I have a problem with sorting it. It is never sorted on basis of the subcolumn field value but on the basis of the parent column (supercolumn) field value. That means it is taking what is in the [pSortableColumn] attribute instead of what is in the [field] attribute of the sorting icon.

Is there any way I could resolve that? This is my code below (I removed styling):

<th
    *ngFor="let col of columns; let i = index;"
    pResizableColumn
    pReorderableColumn
    [pSortableColumn]="col.field"
    [pSortableColumnDisabled]="col.showSort === false"
>
    <ng-container *ngIf="col.type !== 'superColumn'">
        <span>{{ col.header }}</span>
        <p-sortIcon [field]="col.field"></p-sortIcon>
    </ng-container>

    <ng-container *ngIf="col.type === 'superColumn'">
        <div>{{ col.header }}</div>
        <ng-container *ngFor="let subColumn of col.subColumns">
            <div>
                {{ subColumn.header }}
                <p-sortIcon [field]="subColumn.field"></p-sortIcon>
            </div>
        </ng-container>
    </ng-container>
</th>