Мат шаблон таблицы не загружается

Question

Попытка создать общую таблицу, которая будет принимать столбцы из файла TS и загружать данные.

Получение этой ошибки:

ng: ///AppModule/TableBasicExample.ngfactory.js: 56 Ошибка: Ошибка: не удалось найти столбец с идентификатором «[объект объекта]».

Код:

/*
* @title Basic use of <table mat-table>
 */
@Component({    
  selector: 'table-basic-example',    
  styleUrls: ['table-basic-example.css'],    
  templateUrl: 'table-basic-example.html',    
})
export class TableBasicExample implements OnInit {     
  displayedColumns: Column[] = [    
    {headername:"name", field:"name"}    
  ];
  dataSource : MatTableDataSource<PeriodicElement> = new MatTableDataSource();    

  ngOnInit() {    
    this.dataSource = new MatTableDataSource(ELEMENT_DATA);    
    console.log(this.dataSource.data);        
    console.log(this.displayedColumns,"columns");      
  }
}

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

  <!--- Note that these columns can be defined in any order.    
        The actual rendered columns are set as a property on the row  
  definition" -->   

  <!-- Position Column -->

  <ng-container *ngFor= "let column of displayedColumns"  
  [matColumnDef]="column.headername">   
    <th mat-header-cell *matHeaderCellDef>{{column.headername}}</th>    
    <td mat-cell *matCellDef="let element"> {{element}} </td>               
  </ng-container>    
  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>    
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr></table>        

Answer 1

Я попал в ту же ошибку и решил ее, добавив строковый массив только со свойствами столбцов:

public columnsProps: string[] = this.displayedColumns.map((column: Column) => column.field);

Затем вы должны использовать этот новый массив вместо массива displayColumns в тегах 'mat-header-row' и 'mat-row':

<tr mat-header-row *matHeaderRowDef="columnsProps"></tr>
<tr mat-row *matRowDef="let elemento; columns: columnsProps"></tr>

Я предполагаю, что ошибка говорит о том, что mat-row ищет строку с 'matColumnDef', равным каждому из предоставленных столбцов, но она получает объект вместо самого свойства, если это объект, он не ' не знаю, какое свойство использовать.