Angular Material v6 Mat-Footer-“无法读取未定义的属性'模板'" [英] Angular Material v6 Mat-Footer - "Cannot read property 'template' of undefined"
问题描述
为此,我试图在最近升级到角度6之后将一个页脚行实现到mat-table组件中,但是在表中同时添加了mat-footer-cell和mat-footer-row元素后,我出现以下错误:
I'm trying to implement a footer row into a mat-table component after recently upgrading to angular 6 for this purpose, but after adding both the mat-footer-cell and mat-footer-row elements in the table, I get the following error:
错误TypeError:无法读取未定义的属性模板" 在MatFooterRowDef.push ../node_modules/@angular/cdk/esm5/table.es5.js.CdkFooterRowDef.extractCellTemplate(vendor.js:17400)
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符号.
The table still appears on the page, but with no data, no footer row, and a T symbol where to the right of each column heading.
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/>
元素,即使仅一栏将包含内容.
FIXED: This was not made clear in the material documentation, but all columns must contain a <mat-footer-cell/>
element, even if only one column will contain content.
这篇关于Angular Material v6 Mat-Footer-“无法读取未定义的属性'模板'"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!