Angular "let-col" 没有传递所有属性

Question

我正在尝试传递额外的字段来帮助处理。这就是我定义列数组的方式：

this.columns = [
        {field: 'vin', header: 'Vin', isMultiRowColumn: true },
        {field: 'year', header: 'Year', isMultiRowColumn: false},
        {field: 'brand', header: 'Brand', isMultiRowColumn: false},
        {field: 'color', header: 'Color', isMultiRowColumn: false}
    ];

现在，当我运行下面的代码时：

<p-dataTable [value]="testData">
  <p-column *ngFor="let col of columns" [field]="col.field" [header]="col.header">
    <ng-template let-col let-dt="rowData" pTemplate="body">
     <span>{{dt[col.field] + '-' + col.isMultiRowColumn }}</span>
    </ng-template>
  </p-column>
</p-dataTable>

我明白了：

dsad231ff-undefined 2012-undefined  VW-undefined    Orange-undefined

有什么原因 isMultiRowColumn 没有通过吗？

感谢您的帮助

Answer 1

使用 let-col 上下文属性 $implicit 在绑定模板中作为 col 可用。并且您在 ngfor 中选择了与 let-col 相同的 col var，当您定义 let-col 时，它会创建一个新变量，该变量引用具有字段属性的 table col 和它没有引用 ngFor 中定义的 col 变量，它有字段属性但没有 isMultiRowColumn 属性，因此请尝试更改 ngfor 变量从 col 到 column:

同时检查：

<p-dataTable [value]="testData">
  <p-column *ngFor="let column of columns" [field]="column.field" [header]="column.header">
    <ng-template let-col let-dt="rowData" pTemplate="body">
     <span>{{dt[column.field] + '-' + column.isMultiRowColumn }}</span>
    </ng-template>
  </p-column>
</p-dataTable>

查看 DEMO 并单击按钮并检查浏览器中的日志以查看 col 的真实情况。

Angular "let-col" 没有传递所有属性

Angular "let-col" is not passing all the properties

angular

primeng-datatable