Javascript 角度-表格排序不适用于嵌套对象

我有一个角度表，但日期排序不正确。除日期外，其余列的排序都非常好。我想这是因为日期是一个嵌套对象，我尝试使用matSortChange（）但是没有任何效果

我在这里创建了一个演示：

我确实尝试添加一个自定义排序函数来对日期进行排序，但它不能正常工作

   public changeSort(event: Event) {

     if (event.active === 'date') {   
       this.dataSource.filteredData = this.dataSource.filteredData.sort(function(a, b) {
      return new Date(a.timeModel.CreatedTime).getTime() - new Date(b.timeModel.CreatedTime).getTime();
    });
    }

  }

HTML

不
{{element.position}
名称
{{element.name}
重量
{{element.weight}}
日期
{{element.timeModel.CreatedTime}
} 

我可以检测到您代码中的一些问题：

你所有的日期都是一样的，所以没有排序会影响它

在函数

changeSort

if（event.direction==“desc”）中，尝试将其更改为

if（event.active==“date”）

，其他排序工作正常，您只想在进行日期排序时排除此条件

---

看起来Angular不知道应该排序的属性的正确方式。因此，我们可以使用自定义排序数据访问器将其显示给Angular：

public changeSort(event: Event) {
    console.log(event)
    this.dataSource.sortingDataAccessor = (item, property) => {
        switch (property) {
            case 'date': return item.timeModel.CreatedTime;
            default: return item[property];
        }
    };
}

---

是的，问题是因为它是一个对象

matColumnDef=“weight”

描述了排序函数中要使用的属性。因此，从这个对象：

{
  position: 1,
  name: 'A', 
  weight: 1.5079, 
  timeModel: {CreatedTime: "2020-04-30T15:38:11.186Z", LastModified: "2020-06-08T15:38:11.186Z"}
}

取重量。但是

matColumnDef=“date”

只会导致

未定义的
-对象中没有属性
date

因此，如果可能，请更改数据源对象并仅提供它所需的日期（因为您似乎只在表中使用
CreatedTime
）

您还可以覆盖
排序数据访问器
，它最初看起来像这个atm：

sortingDataAccessor: ((data: T, sortHeaderId: string) => string|number) =
    (data: T, sortHeaderId: string): string|number => {
  const value = (data as {[key: string]: any})[sortHeaderId];

  if (_isNumberValue(value)) {
    const numberValue = Number(value);
    return numberValue < MAX_SAFE_INTEGER ? numberValue : value;
  }

  return value;
}

p、 如果要保留该功能，您需要从Angular导入
MAX\u SAFE\u INTEGER
和
isNumberValue
。
将unix时间戳存储为数据，并在屏幕上显示时格式化。这样，您就不需要创建排序函数

下面是一个工作示例
很抱歉，我在演示中确定了日期并更新了changeSort，但它仍然不起作用。我打赌它是按字符串排序的。在数据中直接将日期转换为Unix时间，例如：{CreatedTime:1567562058}。当您在屏幕上显示数据时，请将Unix时间转换为日期（）对象，然后按您想要的方式格式化。
{
  position: 1,
  name: 'A', 
  weight: 1.5079, 
  timeModel: {CreatedTime: "2020-04-30T15:38:11.186Z", LastModified: "2020-06-08T15:38:11.186Z"}
}

sortingDataAccessor: ((data: T, sortHeaderId: string) => string|number) =
    (data: T, sortHeaderId: string): string|number => {
  const value = (data as {[key: string]: any})[sortHeaderId];

  if (_isNumberValue(value)) {
    const numberValue = Number(value);
    return numberValue < MAX_SAFE_INTEGER ? numberValue : value;
  }

  return value;
}

this.dataSource.sortingDataAccessor = (data, sortHeaderId) => {
  const value = (data as {[key: string]: any})[sortHeaderId];
  
  const MAX_SAFE_INTEGER = 9007199254740991;

  if (_isNumberValue(value)) {
    const numberValue = Number(value);    
    return numberValue < MAX_SAFE_INTEGER ? numberValue : value;
  }

  if (sortHeaderId === 'date') {
    return new Date(data.timeModel.CreatedTime)
  }

  return value;
}