проблема, связанная с несколькими таблицами матов в * ngFor в angular6 - PullRequest
0 голосов
/ 11 декабря 2018

у меня следующий HTML

 <mat-accordion>
        <mat-divider></mat-divider>
        <mat-expansion-panel *ngFor="let panel of SummaryData">
          <mat-expansion-panel-header class="custom-mat-expansion-panel-header">
            <mat-panel-title>
              <div class="yelloWarnning"></div>
              <div>
                <p>{{panel.startTime}}</p>
                <p>{{panel.endTime}}</p>
              </div>
            </mat-panel-title>
          </mat-expansion-panel-header>
          <div class="panel-body">

            <div class="table-container" *ngFor='let type of panel.types'>
              <ng-template *ngFor="let tbl of type.Tables">
               <table mat-table  [dataSource]="tbl"  class="mat-elevation-z8">
                <ng-container  matColumnDef="BinningName">
                  <th mat-header-cell *matHeaderCellDef> Binn Name </th>
                  <td mat-cell *matCellDef="let element">{{element.BinningName}} </td>
                </ng-container>
                <ng-container  matColumnDef="xAxis">
                    <th mat-header-cell *matHeaderCellDef>xAxis </th>
                    <td mat-cell *matCellDef="let element">{{element.xAxis}} </td>
                  </ng-container>
                  <ng-container  matColumnDef="yAxis">
                      <th mat-header-cell *matHeaderCellDef> yAxis </th>
                      <td mat-cell *matCellDef="let element">{{element.yAxis}} </td>
                    </ng-container>
                <tr mat-header-row *matHeaderRowDef="tableColumns"></tr>
                <tr mat-row *matRowDef="let row; columns: tableColumns;"></tr>

              </table>
            </ng-template>
            </div>

          </div>
        </mat-expansion-panel>
      </mat-accordion>

я получаю следующую ошибку:

Provided data source did not match an array, Observable, or DataSource

У меня есть некоторая динамическая логика в component.ts, которая устанавливает массив в types У меня есть следующиекод в машинописном тексте, который генерирует объект:

   self.startDateEndDateList.map(function (item) {

      let binnObjectsByType:any =[];
      binningType.map(function (binType) {
        let binningObjects = self.OriginData.binnings.filter(x => x.startTime == item.startTime && x.endTime == item.endTime && x.type == binType);
        let row:any ={'Type': binType};
        let tables:any=[];
        binningObjects.map(function(binObj){
            let iOriginData:any = {"vin":self.OriginData.vin,"binnings":[]};
            iOriginData.binnings.push(binObj);
            let BinningDataHandlerObject :BinningDataHandler = new BinningDataHandler(iOriginData,"BinningTable");
            tables.push({"BinningName":BinningDataHandlerObject.SelectedBinningName,"xAxis":BinningDataHandlerObject.xAxisFinalValue,"yAxis":BinningDataHandlerObject.yAxisFinalValue });
        });
        binnObjectsByType.push({'Type': binType,'Tables':tables});
      });

      self.SummaryData.push({"startTime":item.startTime,"endTime":item.endTime,"types":binnObjectsByType});
    });

возможно ли поместить таблицу mat в цикл for?

Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...