Angular Material Table: custom sort foler and file items

Issue

I have different types of items in my mat-table: Files and Folders.
They have to get sorted like in Microsofts file-explorer. Folders can`t be separated from folders and likewise with files.
All other sorting rules staying the same.

Has anyone an idea how to solve this?
Thank you in advance!

Solution

You will have to overwrite the sortData on your MatTableDataSource attached to the table. This is the function that is responsible for sorting records, e.g.

this.dataSource.sortData = (data: YourObjectType[], sort: MatSort) => {
 return data.sort((a: YourObjectType, b: YourObjectType => {
   //Sorting logic here
 });
}

You can look at the default implementation in the material code on github:
https://github.com/angular/components/blob/c2a20c4a035ef57bf598fd78bc7284c180b34c78/src/material/table/table-data-source.ts#L168

Answered By – TotallyNewb

Answer Checked By – Marie Seifert (AngularFixing Admin)

Leave a Reply

Your email address will not be published.