html - Show sort icon by default - ngx-easy-table - Stack Overflow

<ngx-table
  [data]="data"
  [configuration]="configuration"
  [columns]="columns"
  (event)="eventEmitted($event)"
  [noResultsTemplate]="noResultsTemplate"
>
</ngx-table>

Here, the sorting icon is enabled when we click on header title. Is there a way to enable sorting icon by default at all time?

<ngx-table
  [data]="data"
  [configuration]="configuration"
  [columns]="columns"
  (event)="eventEmitted($event)"
  [noResultsTemplate]="noResultsTemplate"
>
</ngx-table>

Here, the sorting icon is enabled when we click on header title. Is there a way to enable sorting icon by default at all time?

• html
• css
• angular
• ngx-easy-table

Share Improve this question Follow edited Feb 3 at 4:39 Naveeth asked Jan 31 at 10:54 NaveethNaveeth 1344 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You can check the below changes in code. The key configurations to show sort icons by default are:

orderEnabled: true - Enables the sorting functionality showOrderArrow: true - Makes the sort arrows visible orderEventOnly: false - Allows clicking anywhere in the header for sorting

public configuration: Config = {
    showContextMenu: false,
    fixedColumnWidth: false,
    tableLayout: {
      style: STYLE.TINY, // or any other style you prefer
      theme: STYLE.THEME,
      borderless: false,
      hover: true,
      striped: false
    },
    headerEnabled: true,
    // These are the key settings for showing sort icons by default
    orderEnabled: true,           // Enable ordering/sorting
    orderEventOnly: false,        // Allow clicking anywhere in header for sort
    persistState: false,          // Don't persist sort state
    showOrderArrow: true         // Show the order arrow always
  };