如何对 PrimeNG 表中具有动态列数的某些列使用日期管道

Question

我正在尝试显示动态列数，并且还尝试使用<ng-template ... 来指定单元格的呈现方式。但是在我的数据集中，有一些字段属于日期类型。我想使用日期管道格式化这些字段。

html文件

<ng-template pTemplate="body" let-rowData let-columns="columns">
      <tr>
        <td *ngFor="let col of columns" [style.width]="col.width">
          {{rowData[col.field]| col?.pipe}}
        </td>
      </tr>
</ng-template>

typescript 文件（在 cols 数组中，我想添加另一个这样的字段。）

 this.cols = [
      { field: 'no', header: 'No.', width: '50px',pipe:null },
      { field: 'createdDate', header: 'createdDate', width: '175px', pipe: 'date: \'dd/MM/yyyy\''},
      { field: 'deviceName', header: 'Device Name', width: '150px'}
    ];

我已经尝试过了，它给了我模板解析错误。

ERROR 错误：未捕获（承诺中）：错误：模板解析错误：

Answer 1

这样试试

this.cols = [
          { field: 'no', header: 'No.', width: '50px',pipe:null },
          { field: 'createdDate', header: 'createdDate', width: '175px', data: true , format: `dd/MM/yyyy`},
          { field: 'deviceName', header: 'Device Name', width: '150px'}
        ];

模板

<ng-template pTemplate="body" let-rowData let-columns="columns">
      <tr>
        <td *ngFor="let col of columns" [style.width]="col.width">   
          {{ col.data ? (rowData[col.field]| date : col.format) : rowData[col.field] }}
        </td>
      </tr>
</ng-template>

demo ??