时间戳

首页 > 解决方案 > Angular Material v6 Mat-Footer - “无法读取未定义的属性‘模板’”

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

问题描述

在最近为此目的升级到 angular 6 之后，我正在尝试将页脚行实现到 mat-table 组件中，但是在表中添加了 mat-footer-cell 和 mat-footer-row 元素之后，我得到以下错误：

错误类型错误：无法读取 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>

标签： angularangular-materialangular6

解决方案

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

推荐阅读