要解决Angular Material数据表格无法排序的问题,可以按照以下步骤进行操作:
import { MatTableModule } from '@angular/material/table';
import { MatSortModule } from '@angular/material/sort';
@NgModule({
imports: [
MatTableModule,
MatSortModule,
// 其他导入项...
],
// 其他配置项...
})
export class AppModule { }
Name
{{element.name}}
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatTableDataSource } from '@angular/material/table';
import { MatSort } from '@angular/material/sort';
@Component({
// 组件配置项...
})
export class YourComponent implements OnInit {
dataSource: MatTableDataSource;
displayedColumns: string[] = ['name', 'otherColumn', ...];
@ViewChild(MatSort, { static: true }) sort: MatSort;
ngOnInit() {
// 初始化数据源
this.dataSource = new MatTableDataSource(yourDataArray);
// 绑定MatSort对象到数据源
this.dataSource.sort = this.sort;
}
}
.mat-sort-header-button {
padding: 0;
}
.mat-sort-header-arrow {
margin: 0;
}
通过按照以上步骤操作,您应该能够在Angular Material数据表格中实现排序功能。