如何创建具有修正列和* ngFor生成的修正列的mat表?

时间:2019-09-05 14:48:39

标签: angular-material

我正在建立一个消耗品表。有些行,例如Title,将始终存在。因此,我希望在表中声明它们的标记,以免在组件内部出现太多标记。

运行应用程序时,我看不到任何“标题”列。

<table mat-table id="selection-info-tbl1" #table1 [dataSource]="config.eventData"
   multiTemplateDataRows>

 <ng-container matColumnDef="Title">
     <th mat-header-cell *matHeaderCellDef> Title </th>
     <td mat-cell *matCellDef="let element"> {{ element.Title }} </td>
 </ng-container>

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

 <ng-container matColumnDef="expandedDetail">

    //more code ...

 </ng-container>
 <tr mat-header-row *matHeaderRowDef="bottomTableDisplayedColumns"></tr>
 <tr mat-row *matRowDef="let element; columns: bottomTableDisplayedColumns;" 
     class="example-element-row"
     [class.example-expanded-row]="expandedElement === element"
                  (click)="expandedElement = expandedElement === element ? null : element">
     </tr>
     <tr mat-row *matRowDef="let row; columns: ['expandedDetail']"
      class="example-detail-row"></tr>

</table>

如何将固定列与* ngFor生成的列混合使用?

感谢您的帮助。

0 个答案:

没有答案