Angular Material v6 Mat-Footer – “无法读取未定义的属性’模板’”

前端之家收集整理的这篇文章主要介绍了Angular Material v6 Mat-Footer – “无法读取未定义的属性’模板’”前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
为了这个目的,我最近在升级到角度6之后尝试在mat-table组件中实现一个页脚行,但是在表格中添加mat-footer-cell和mat-footer-row元素后,我得到以下内容错误

ERROR TypeError: Cannot read property ‘template’ of undefined
at MatFooterRowDef.push../node_modules/@angular/cdk/esm5/table.es5.js.CdkFooterRowDef.extractCellTemplate (vendor.js:17400)

该表仍显示页面上,但没有数据,没有页脚行,并且每个列标题右侧的T符号.

HTML

<ng-container matColumnDef="total">

    <mat-header-cell *matHeaderCellDef mat-sort-header style="width: 15%; flex: none">Total</mat-header-cell>

    <mat-cell *matCellDef="let item" style="width: 15%; flex: none">{{item.total | currency: 'GBP'}}</mat-cell>

    <td mat-footer-cell *matFooterCellDef>100</td>

  </ng-container>

  <mat-header-row *matHeaderRowDef="tableColumns"></mat-header-row>

  <mat-row *matRowDef="let row; columns: tableColumns" (click)="editItem(row)"></mat-row>

  <tr mat-footer-row *matFooterRowDef="tableColumns"></tr>

</mat-table>

解决方法

修复:材料文档中没有明确说明,但所有列都必须包含< mat-footer-cell />元素,即使只有一列将包含内容.

猜你在找的Angularjs相关文章