API data {
id: 1,
date: "21/may/2020",
name: "Server A",
geo: "Europa",
status: "online"
}
ngOnInit {
this.col = [
{field: 'name', header: 'Server Name'},
{field: 'geo', header: 'Geography'},
{field: 'status', header: 'Status'},
{field: 'date', header: 'Date'}
]
}
我正在测试 angular PrimeNG 并且我有一个数据表,我在其中手动设置每个表行的值,它工作正常。
模板
<ng-template>
<td>
<tr>
<td>{{rowData.name}}</td>
<td>{{rowData.geo}}</td>
<td>{{rowData.status}}</td>
<td>{{rowData.date | date: 'dd/MMM/yyyy'}}</td>
</tr>
<td>
<ng-template>
我更新了模板以动态循环遍历对象并设置数据,如何更新循环以便在渲染“日期”对象时插入管道。
<td *ngFor="let col of column">
{{rowData[col.field]}}
</td>
以上{{rowData[col.field]}}
是有效的,但我不知道如何在里面*ngFor="let col of columns "
我只能更新 col.date 并将管道添加到其中。
这是我尝试但没有成功的方法,bave 正在工作,但 Pipe 没有,如果我添加 keyvalue,表格数据将不再显示。
<td *ngFor="let col of columns | keyvalue">
<ng-container *ngIf="rowData[col.field] !== 'date'"> {{rowData[col.field]}}</ng-container>
<ng-container *ngIf="rowData[col.field] === 'date'"> {{rowData[col.field] | date: 'dd/MMM/yyyy'}}</ng-container>
</td>
我可以研究的任何建议或示例?