정렬 헤더가있는 일반 Angular Material 2 DataTable이 있습니다. 모든 정렬은 헤더가 잘 작동합니다. 물건을 가치로하는 것을 제외하고. 이것들은 전혀 정렬되지 않습니다.
예를 들면 :
<!-- Project Column - This should sort!-->
<ng-container matColumnDef="project.name">
<mat-header-cell *matHeaderCellDef mat-sort-header> Project Name </mat-header-cell>
<mat-cell *matCellDef="let element"> {{element.project.name}} </mat-cell>
</ng-container>
참고 element.project.name
displayColumn 구성은 다음과 같습니다.
displayedColumns = ['project.name', 'position', 'name', 'test', 'symbol'];
변경 'project.name'
하려면 'project'
작동하지 않습니다도"project['name']"
내가 무엇을 놓치고 있습니까? 이것이 가능할까요?
Stackblitz : Angular Material2 DataTable 정렬 개체
편집 : 모든 답변에 감사드립니다. 나는 이미 동적 데이터로 작업하고 있습니다. 따라서 새로운 중첩 속성마다 switch 문을 추가 할 필요가 없습니다.
내 솔루션은 다음과 같습니다. (MatTableDataSource를 확장하는 새 DataSource를 만들 필요가 없습니다)
export class NestedObjectsDataSource extends MatTableDataSource<MyObjectType> {
sortingDataAccessor: ((data: WorkingHours, sortHeaderId: string) => string | number) =
(data: WorkingHours, sortHeaderId: string): string | number => {
let value = null;
if (sortHeaderId.indexOf('.') !== -1) {
const ids = sortHeaderId.split('.');
value = data[ids[0]][ids[1]];
} else {
value = data[sortHeaderId];
}
return _isNumberValue(value) ? Number(value) : value;
}
constructor() {
super();
}
}