Question

我有一个具有嵌套数组的数据源，我想从一个数组中显示这些项目在数组中，但还要显示数据的第一级数组。

我已经尝试过* ngFor，但这不是我想要做的，因为它只会在td内部进行迭代。

这是我的数据源

[
 {
   success: {
     item_name: "door",
     item_code: 2
   },
   error: [
     {
       type_name: "error1",
       type_code: 1
     },
     {
       type_name: "error2",
       type_code: 2
     },
     {
       type_name: "error3",
       type_code: 3
     }
   ]
 }
]

这是我的材料表：

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

    <ng-container matColumnDef="item_name">
        <mat-header-cell *matHeaderCellDef>Item Name</mat-header-cell>
        <mat-cell *matCellDef="let row">{{row.success.item_name}}</mat-cell>
    </ng-container>

    <ng-container matColumnDef="item_code">
        <mat-header-cell *matHeaderCellDef>Item Code</mat-header-cell>
        <mat-cell class="description-cell"
                  *matCellDef="let row">{{row.success.item_code}}</mat-cell>

    </ng-container>

    <ng-container matColumnDef="type_name">
        <mat-header-cell *matHeaderCellDef>Type Name</mat-header-cell>
        <mat-cell class="duration-cell"
                  *matCellDef="let row">{{row.error[0].type_name}}</mat-cell>
    </ng-container>
    <ng-container matColumnDef="type_code">
        <mat-header-cell *matHeaderCellDef>Type Code</mat-header-cell>
        <mat-cell class="duration-cell"
                  *matCellDef="let row">{{row.error[0].type_code}}</mat-cell>
    </ng-container>

    <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>

    <mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>

</mat-table>

我希望它们可以同时全部显示出来，但是什么也不显示。我无法更改数据的结构，因为它是必需的格式。因此，即使我愿意，也无法将其设置为1级数组。

在此先感谢您的帮助

如何从嵌套数组的材料表数据源中获取数据

0 个答案: