我正在使用Angular Material Design表构建几个表 . 我已经设法从json文件中获取数据填充表 . 但是JSON文件有一些list [],我无法从html访问 .
这是我的服务中从JSON文件获取数据的代码:
getReceiptAll(): Observable<ReceiptAll[]> {
return this.http.get<ReceiptAll[]>(this.serviceUrl)
}
这是组件中的数据源:
export class ReportDataSource extends DataSource<any> {
constructor(private receiptService: ReceiptService) {
super();
}
connect(): Observable<ReceiptAll[]> {
return this.receiptService.getReceiptAll();
}
disconnect() {}
}
这是我如何在html文件中构建表:
<mat-table #table [dataSource]="dataSource">
<!--* ID Column -->
<ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef> ID </mat-header-cell>
<mat-cell *matCellDef="let receipt"> {{receipt.id}} </mat-cell>
</ng-container>
<!--* Period Start Column -->
<ng-container matColumnDef="receipt">
<mat-header-cell *matHeaderCellDef> Date </mat-header-cell>
<mat-cell *matCellDef="let receipt"> {{receipt.receipts.receivedDate}} </mat-cell>
</ng-container>
这是JSON文件的一部分,因为您可以看到收据在数组中,这就是为什么无法使用getDate访问
receipt.receipts.receivedDate使用html文件中的mat-cell标签 .
[
{“companyName”:“Acme”,“documentType”:“标准”,“收据”:[{“receivedDate”:“2018-04-26T09:05:53.566Z”,
我想这可能是我应该在服务中从数据中访问内容以使其在组件DataSource中可用的东西,但我还没弄清楚是什么 .
任何建议表示赞赏 .