Таблица угловых материалов: заполнить сгенерированные столбцы данными строки

Question

Мое приложение использует массив элементов JSON этого интерфейса:

export interface ElementData {
    elementID: string;
    elementType: string;
    elementTypeTitle: string;   
    nbr: number;
    name: string;  
    site: string;   
    states: StateInfo[];
  }

import { StateDefinition } from "./StateDefinition";

export interface StateInfo {
    definition: StateDefinition
    stateValue: string
}

import { StateEnumDefinition } from './StateEnumDefinition';

export interface StateDefinition {
    stateNbr: number
    elementTyp: string
    stateType: string
    stateTypeTitle: string
    enumValues: StateEnumDefinition[]
}

Содержание должно отображаться в таблице. Вот реализация (HTML):

<table mat-table [dataSource]="dataSource" class="example-table">
      <ng-container [matColumnDef]="column" *ngFor="let column of displayedColumns">
        <th mat-header-cell *matHeaderCellDef> {{column}} </th>
        <td mat-cell *matCellDef="let element"> {{element[column]}} </td>
      </ng-container>

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

А вот файл ts:

displayedColumns: string[] = ['nbr', 'name', 'site'];
columnsToDisplay: string[] = this.displayedColumns.slice();

 getAllElementsForSiteAndType(siteID: string, elementType: string){
    this._elementsService.getElementsForSiteAndType(siteID, elementType).subscribe(result => {

      this._elements = result;

      if (result != null && result.length > 0)
      {
        result[0].states.forEach(state => {
          this.displayedColumns.push(state.definition.stateTypeTitle)
          this.columnsToDisplay.push(this.displayedColumns[this.displayedColumns.lastIndexOf(state.definition.stateTypeTitle)]);
        });
      }

      this.dataSource = new MatTableDataSource(result);

    });
  }

Таблица должна иметь «статические» строки, такие как ElementData.nbr, ElementData.name и ElementData.site.

Таблица также должна иметь «динамические» столбцы, основанные на elementType (например, телевизор имеет различные состояния, например, холодильник). Поэтому мне нужно сгенерировать «динамические» столбцы на основе состояний моего StateInfo[] массива. Это то, что работает до сих пор.

Моя проблема в том, как заполнить столбцы данными.

Заголовок должен быть "ElementData.states [x] .definition.stateTypeTitle" и значение ячейки должно быть "ElementData.states [x] .stateValue"

Есть идеи, как этого добиться?