重复列定义 [object Object] Mat-table答案

【问题标题】：Duplicate column definition [object Object] Mat-table重复列定义 [object Object] Mat-table
【发布时间】：2019-08-27 14:39:43
【问题描述】：

我正在创建包含嵌套类型数据行的 mat-table。

Value 构造为字符串对象数组。目标是将这些对象中的每一个分配到不同的列。

对象构造：

weeks: [{week: '1'},{week: '0'},{week: '3'},{week: '4'},{week: '5'}]

创建列和分配数据：

<ng-container matColumnDef="{{wk}}" *ngFor="let wk of weekHeaders; index as idx">
       <mat-header-cell *matHeaderCellDef>
        <div fxLayout="column">
          <div class="mt-05">{{wk.header}}</div>
          <div *ngIf="wk.weekNo" >{{wk.startDate | date: 'dd-MM-yyyy'}}</div>
          <div *ngIf="wk.weekNo">{{wk.endDate | date: 'dd-MM-yyyy'}}</div>
        </div>
       </mat-header-cell>
       <mat-cell *matCellDef="let row;"> {{row.weeks[idx].week}} </mat-cell>
</ng-container>

我本来应该是这样的：

week1 - 赋值 = 1

week2 - 赋值 = 0

week3 - 赋值 = 3

...

但我收到以下错误：

Duplicate column definition name provided: "[object Object]".

编辑：

界面：

export interface DataTable {
    type: string;
    process: string;
    weeks: {week:String}[];
    finalWeek: number;
  }

列设置：

<mat-header-row *matHeaderRowDef="detailedColumns" class="plan-header-row"></mat-header-row>
<mat-row *matRowDef="let row; columns: detailedColumns;">
</mat-row>

【问题讨论】：

错误是因为您在<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> 行中定义了“displayedColumns” - 而不是在代码中 - 作为对象数组，这必须是字符串数组。当然你可以使用一些类似于displayedColumns=this.yourArray.map(x=>x.your_property_related_column_name)，但没有更多数据是不可能知道的
用所需信息编辑帖子。

标签： angular typescript angular-material

【解决方案1】：

问题解决了。 matColumnDef="{{wk}}" 这个元素正在等待字符串，我正在给他对象。唯一需要以这样的方式给他字符串matColumnDef="{{wk.header}}"感谢Eliseo的提示。

【讨论】：