来自其余 API 的数据未显示在 Angular Material Table 中
Data from rest API not showing up in Angular Material Table
我正在尝试显示 angular material table 中的数据,这里是获取从 API
获取数据的请求
export class ProductsListComponent implements OnInit {
// Table fields
displayedColumns = ['select', 'country', 'actions'];
datasource = ????? //how should I give api's data source
}
ngOnInit() {
let observ = this.http.get('https://kbzp6jhg2h.execute-api.us-east-1.amazonaws.com/Prod/api/v1/hierarchy/countries?status=1');
observ.subscribe((res)=> {
console.log("response from api",res['data']);
});
这是 html 文件,我想在其中显示来自 API
的数据
<mat-table class="lmat-elevation-z8" #table [dataSource]="dataSource">
<ng-container matColumnDef="country">
<mat-header-cell *matHeaderCellDef>Country Name</mat-header-cell>
<mat-cell *matCellDef="let product">{{product.name}}</mat-cell>
</ng-container>
</mat-table>
如何使用空数组初始化 datasource
并在数据来自可观察对象时重置它?类似于:
export class ProductsListComponent implements OnInit {
// Table fields
displayedColumns = ['select', 'country', 'actions'];
datasource = []
ngOnInit() {
this.http.get('https://kbzp6jhg2h.execute-api.us-east-1.amazonaws.com/Prod/api/v1/hierarchy/countries?status=1')
.subscribe((res)=> {
this.datasource = res
});
}
}
我正在尝试显示 angular material table 中的数据,这里是获取从 API
获取数据的请求export class ProductsListComponent implements OnInit {
// Table fields
displayedColumns = ['select', 'country', 'actions'];
datasource = ????? //how should I give api's data source
}
ngOnInit() {
let observ = this.http.get('https://kbzp6jhg2h.execute-api.us-east-1.amazonaws.com/Prod/api/v1/hierarchy/countries?status=1');
observ.subscribe((res)=> {
console.log("response from api",res['data']);
});
这是 html 文件,我想在其中显示来自 API
的数据<mat-table class="lmat-elevation-z8" #table [dataSource]="dataSource">
<ng-container matColumnDef="country">
<mat-header-cell *matHeaderCellDef>Country Name</mat-header-cell>
<mat-cell *matCellDef="let product">{{product.name}}</mat-cell>
</ng-container>
</mat-table>
如何使用空数组初始化 datasource
并在数据来自可观察对象时重置它?类似于:
export class ProductsListComponent implements OnInit {
// Table fields
displayedColumns = ['select', 'country', 'actions'];
datasource = []
ngOnInit() {
this.http.get('https://kbzp6jhg2h.execute-api.us-east-1.amazonaws.com/Prod/api/v1/hierarchy/countries?status=1')
.subscribe((res)=> {
this.datasource = res
});
}
}