Блог

Я динамически загружаю таблицу mat, выполняя следующие действия:

 lt;mat-table mat-table [dataSource]="dataSource"gt;  lt;ng-container *ngFor="let col of dispColumns" matColumnDef="{{col}}"gt;  lt;mat-header-cell *matHeaderCellDefgt;{{col}}lt;/mat-header-cellgt;  lt;mat-cell *matCellDef="let element "gt;  {{element[col]}}  lt;/mat-cellgt;  lt;/ng-containergt;   lt;mat-header-row *matHeaderRowDef="dispColumns"gt;lt;/mat-header-rowgt;  lt;mat-row *matRowDef="let row; columns: dispColumns;"gt;lt;/mat-rowgt; lt;/mat-tablegt; lt;mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons  aria-label="Select page of query data"gt; lt;/mat-paginatorgt;  

и я могу видеть столбцы заголовка. Однако я не вижу остальных данных в таблице. Он показывает количество строк в зависимости от dataSource длины, но, похоже, не выводит фактические метаданные? Как я могу исправить эту проблему?

Вот как выглядит мой компонент:

 export class Component implements OnInit {   constructor(  private store: Store,  ) { }   ngOnInit(): void {  }   get dataSource() {  return this.store.dataSource;  } }  

Вы можете видеть, что я читаю dataSource из магазина, который выглядит так:

 public dataSource = new MatTableDataSourcelt;anygt;([]);  

а затем я установил dataSource его в другом файле, как это:

 this.store.dataSource = data;  

Я делаю что-то плохое? Любая помощь будет очень признательна!

 lt;mat-cell *matCellDef="let element "gt;  {{element[col]}}  lt;/mat-cellgt;  

у вас нет данных ,позвольте элементу данных

менять

 lt;mat-table mat-tablegt; lt;/mat-tablegt;  

Для-

 lt;table mat-table ..gt; .... lt;/tablegt;  

Успехов:)!

Я разобрался в проблеме, и оказалось, что это было из-за col неправильного отображения, поэтому на нем отображалась пустая таблица: -)