Tengo una tabla de datos de material angular 2 normal con encabezados de clasificación. Todo tipo de encabezados funcionan bien. Excepto el que tiene un objeto como valor. Estos no se clasifican en absoluto.
Por ejemplo:
<!-- 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>
nota la element.project.name
Aquí está la configuración de displayColumn:
displayedColumns = ['project.name', 'position', 'name', 'test', 'symbol'];
Cambiar 'project.name'
a 'project'
no funciona ni"project['name']"
¿Qué me estoy perdiendo? ¿Es esto siquiera posible?
Aquí hay un Stackblitz: objetos de ordenación Angular Material2 DataTable
Editar: Gracias por todas tus respuestas. Ya lo tengo funcionando con datos dinámicos. Por lo tanto, no tengo que agregar una declaración de cambio para cada nueva propiedad anidada.
Aquí está mi solución: (No es necesario crear un nuevo DataSource que amplíe MatTableDataSource)
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();
}
}