CODEWITHSUNDEEP
angularsortingdatatable
michel martin
michel martin

Reputation: 59

Angular Material Data table catch sort event

I want to sort server-side not client-side. so I need to catch the event when the user click on the header of a column. How can I easily catch this event and get the name of the clicked column as well as the asked order ASC or DESC ??

Thank you

Upvotes: 1

Views: 1964

Answers (1)

Amer
Amer

Reputation: 6706

The matSort directive has a matSortChange event, which you can use to get the active Sort, from the following interface:

/** The current sort state. */
export interface Sort {
    /** The id of the column being sorted. */
    active: string;
    /** The sort direction. */
    direction: SortDirection;
}

<mat-table
    #table
    [dataSource]="dataSource"
    matSort
    #tableSort="matSort"
    (matSortChange)="onSortChanged($event)"
    matSortActive="lastUpdated"
    matSortDirection="desc"
>

Upvotes: 3

Related Questions