在Angular Material表格中不显示数据的问题可能是由于以下原因导致的:
@Component({
selector: 'app-table',
template: `
Name
{{element.name}}
`,
})
export class TableComponent {
// 数据数组
data = [
{name: 'John'},
{name: 'Jane'},
{name: 'Bob'},
];
// 显示的列
displayedColumns = ['name'];
}
MatTableModule
和MatSortModule
,这些模块是使用Angular Material表格所必需的。例如:import { MatTableModule } from '@angular/material/table';
import { MatSortModule } from '@angular/material/sort';
@NgModule({
imports: [
// 其他模块
MatTableModule,
MatSortModule,
],
// 组件、服务等
})
export class AppModule { }
styles.css
或者app.component.css
等文件中添加以下代码:@import '~@angular/material/prebuilt-themes/indigo-pink.css';
如果上述解决方法都不起作用,可以检查浏览器的控制台输出以查看是否有任何错误消息。