设置材料表中数组属性中的值答案

【问题标题】：Set value that is in an array property in material table设置材料表中数组属性中的值
【发布时间】：2020-04-04 12:02:00
【问题描述】：

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

注意：我使用 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>

【问题讨论】：

您能在问题中添加供应商 json 吗？

标签： angular angular-material

【解决方案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>

【讨论】：

好的，让我试试