Angular Material Table: custom sort foler and file items


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!


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:

Answered By – TotallyNewb

Answer Checked By – Marie Seifert (AngularFixing Admin)

Leave a Reply

Your email address will not be published.