Reputation:
Sorting works on column Id but it doesn't work on the second column, why so?
<mat-table #detailsTable #detailsSort="matSort" [dataSource]="details" matSort>
<ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef mat-sort-header> Id </mat-header-cell>
<mat-cell *matCellDef="let detail"> {{detail.id}} </mat-cell>
</ng-container>
<ng-container matColumnDef="invoiceCurrencyNetValue">
<mat-header-cell *matHeaderCellDef mat-sort-header> Net value </mat-header-cell>
<mat-cell *matCellDef="let detail"> {{detail.attributes.invoiceCurrencyNetValue}} </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="this.detailsColumns; sticky: true"></mat-header-row>
<mat-row *matRowDef="let row; columns: this.detailsColumns;" matRipple class="element-row"></mat-row>
</mat-table>
And this is how I set the data and sort in .ts
file:
details = new MatTableDataSource(details.data);
details.sort = this.detailsSort;
And this is columns declaration:
detailsColumns = [
'id', 'invoiceCurrencyNetValue'
];
Upvotes: 1
Views: 1983
Reputation: 3142
Most probably because your attributes
is an object, and the sorting is expecting an actual value.
e.g. detail.id can be sorted by id value, but detail.attributes.invoiceCurrencyNetValue cannot be sorted, as it is an object, not an actual value.
You can start from here: Angular Material 2 DataTable Sorting with nested objects
As a reference, you can extend your sort functionality by using "sortingDataAccessor
"
Upvotes: 1