core.js:6014错误TypeError:无法读取未定义的属性“模板”

时间:2020-07-03 13:59:41

标签: angular typescript angular-material

查看类似错误的响应后,我可以看到该错误与* matHeaderCellDef 的使用有关 我正在编写的代码结合了许多不同的功能。我有一个表,该表结合了动态数据以及要在“表单”组中合并的表单元素。 任何帮助将不胜感激。

我的代码如下。

certutil -L -d sql:$HOME/.pki/nssdb/

以下是我的TS文件:

<form [formGroup]="userTable">
 <table mat-table [dataSource]="dataSource" class="mat-elevation-z8">

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

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


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

<ng-container matColumnDef="w1" formArrayName="tableRows" *ngFor="let group of getFormControls.controls ; let i=index">
    <th mat-header-cell *matHeaderCellDef>Week 1</th>
    <!--<td mat-cell *matCellDef="let element;">{{element.w1}}</td>-->
    <td *ngIf="group.get('isEditable').value" [formGroupName]="i">
        <mat-form-field>
            <input matInput type="text" formControlName="patent">
        </mat-form-field>
    </td>
    <td *ngIf="group.get('isEditable').value" [formGroupName]="i">
        <mat-form-field>
            <input matInput type="text" formControlName="collective_actions">
        </mat-form-field>
    </td>

</ng-container>

<ng-container matColumnDef="header-row-first-group">
    <th mat-header-cell *matHeaderCellDef 
        [style.text-align]="center"
        [attr.colspan]="3"> 
    First group 
    </th>
</ng-container>    

<ng-container matColumnDef="header-row-second-group">
    <th mat-header-cell *matHeaderCellDef [attr.colspan]="2"> Second group </th>
</ng-container>

<tr mat-header-row *matHeaderRowDef="['header-row-first-group', 'header-row-second-group']"></tr>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>

该代码在StackBlitz上可用。 https://stackblitz.com/edit/angular-ivy-xhtgrz

1 个答案:

答案 0 :(得分:0)

错误是由于*matCellDef中缺少<td>