Skip to content

Replies

1
bubuna bubusito
bubuna bubusito answered on Oct 12, 2026 8:00 AM
Directive When it applies Example icon
igxSortHeaderIcon No sorting applied unfold_more
igxSortAscendingHeaderIcon Column sorted ascending expand_less
igxSortDescendingHeaderIcon Column sorted descending expand_more

Basic Example

HTML

<igx-grid #grid [data]="data" [autoGenerate]="false">
  <igx-column field="ProductName" header="Product Name" [sortable]="true"></igx-column>
  <igx-column field="UnitPrice" header="Unit Price" [sortable]="true" dataType="number"></igx-column>
  <!-- other columns -->

  <!-- Custom sorting icons -->
  <ng-template igxSortHeaderIcon>
    <igx-icon>unfold_more</igx-icon>
  </ng-template>

  <ng-template igxSortAscendingHeaderIcon>
    <igx-icon>expand_less</igx-icon>
  </ng-template>

  <ng-template igxSortDescendingHeaderIcon>
    <igx-icon>expand_more</igx-icon>
  </ng-template>
</igx-grid>
----------------------

Bitlife hack apk