Question

我有一个关于角度的项目，并且有一个角度材料数据表。因此，我想用json中的数据填充它。因为当我尝试填充它时，什么也没有显示，好像是空的，但是如果我用静态数据填充数据表，它将显示数据。这个想法是用json中的数据填充数据表。

Answer 1

您需要使用从服务中获取的数据实例化MatTableDataSource。

dataSource;
data;

ngOnInit() {
  this.yourService.getData()
    .subscribe((data: Type[]) => {
      this.data = data;
      this.dataSource = new MatTableDataSource(data);
    });
}

然后在您的模板中使用：

<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
  ...
</table>

请注意，从后端获取数据是服务的责任，您只需在其上调用方法即可获取数据。

以下是您的推荐人Sample StackBlitz。在这里，我从JSONPlaceholder API获取用户列表，然后通过设置其dataSource

在模板上显示用户列表

Answer 2

请选中此复选框，希望对您有所帮助：

this.http.get('servieurl').subscribe(data => 
{
 this.apps.push(data);
 this.displayedColumns = ['columnName'];
 this.dataSource = new MatTableDataSource(this.apps);
 }, error => console.error(error));

HTML：

<table mat-table [dataSource]="dataSource">
 ...
</table>

有关更多信息，请检查此链接：fill an angular material datatable with data from a json?

如何用json的数据填充角材料数据表？

2 个答案: