angular - 设置材料表中数组属性中的值

Question

我正在创建一个材料表。数据源的元素具有数组属性。我想在表格的每一列中显示该属性中成员的值，如下面的代码。但是，没有显示任何内容。我哪里弄错了？

注意：我用来创建多列的 ng-container 中的 ngFor。

 <ng-container *ngFor="let vendor of vendors" [matColumnDef]="vendor.Name">
        <mat-header-cell *matHeaderCellDef>{{vendor.Name}}</mat-header-cell>
        <mat-cell *matCellDef="let element">
            <span *ngIf="element.Type == 2 else textValue">
                <span *ngFor="let cost of element.Cost">
                    {{cost}}
                </span>
            </span>
            <ng-template #textValue>
                <span *ngFor="let textValue of element.TextValue">
                    {{textValue}}
                </span>
            </ng-template>
        </mat-cell>
    </ng-container>

标签： angularangular-material

Answer 1

尝试使用th和td元素如下：

<ng-container *ngFor="let vendor of vendors" [matColumnDef]="vendor.Name">
    <th mat-header-cell *matHeaderCellDef>{{vendor.Name}}</th>
    <td mat-cell *matCellDef="let element">
        <span *ngIf="element.Type == 2 else textValue">
            <span *ngFor="let cost of element.Cost">
                {{cost}}
            </span>
        </span>
        <ng-template #textValue>
            <span *ngFor="let textValue of element.TextValue">
                {{textValue}}
            </span>
        </ng-template>
    </td>
</ng-container>