Question

Trying to sort the material table with date column , date format is MM/DD/YYYY ,h:mm A , order of date is not by latest date and time. Anything which i missed from the below stackblitz code.

https://angular-matsordesc.stackblitz.io

Answer 1

The problem is the sort is sorting the date as type string instead of type date.

It works for me changing the ngAfterViewInit for this:

  ngAfterViewInit() {
    this.dataSource.sort = this.sort;
    this.dataSource.sortingDataAccessor = (item, property) => {
      switch (property) {
        case  date : {
          let newDate = new Date(item.date);
          return newDate;
        }
        default: {
          return item[property];
        }
      }
    };
  }

What we are doing here it s when the sort executes, in the case of the date we convert the item.date from string to date. Then the sort executes the property date as a type date.

Here I add a screenshot of https://stackblitz.com/edit/angular-matsordesc?file=src%2Fapp%2Fapp.component.ts where is working:

Answer 2

German Quinteros, this works fine. But when there is ngIf* in a <mat-cell then there will be some empty values in between sorted values of the column.

友情链接