angular primeng 动态专栏

Question

我在使用 primeNg 为我的动态列获取数据时遇到问题。我有以下 JSON 结构：

我的 Component.ts 看起来像这样：

this.claimOverviewService.getCarClaimOverview(this.domain).then(claimOverview => {
  this.carClaimOverview = claimOverview;
  //console.log(this.carClaimOverview);
});

this.cols = [
  {field: 'id', header: 'VorgangsId', type: 'string'},
  {field: 'repairCosts', header: 'Reparaturkosten', type: 'number'},
  {field: 'status.name', header: 'Status', type: 'status'},
  {field: 'creationDate', header: 'Eingang', type: 'date'}
];

我的 Componjent.html 看起来像这样：

<p-table [columns]="cols" [value]="carClaimOverview" [paginator]="true" [rows]="10">
<ng-template pTemplate="header" let-columns>
  <tr>
    <th *ngFor="let col of columns" [pSortableColumn]="col.field">
      {{col.header}}
      <p-sortIcon [field]="col.field"></p-sortIcon>
    </th>
  </tr>
</ng-template>
<ng-template pTemplate="body" let-claim let-columns="columns">
  <tr>
    <td *ngFor="let col of columns">
      <span *ngIf="col.type !== 'date'">
        {{claim[col.field]}}
      </span>
      <span *ngIf="col.type === 'date'">
        {{claim[col.field] | date:'fullDate'}}
      </span>
    </td>
  </tr>
</ng-template>

我的数据表如下所示：如您所见，未显示列状态。我的 cols 数组有一个字段 'status.name'，但名称没有出现。如果我将状态放入字段中，我会在数据表中得到 [object Object]。

所以该字段没有检测到我的 json 的子对象。是否有可能显示我的子对象或让现场知道下面有对象？

Answer 1

只需将字段更改为 claim[col.field]?.name。

替换

中的对象 cols

 {field: 'status.name', header: 'Status', type: 'status'},

到这个

 `{field: 'status', header: 'Status', type: 'status'},`

angular primeng 动态专栏

angular primeng dynamic columns

dynamic-tables

primeng

angular