Kendo Grid-创建动态列名

Question

我正在尝试将此数据加载到Angular KendoGrid的最新版本中。

export const sampleProducts = [
{
  "pin": "100001",
  "name": "Average Soft Drink, Kid",
  "priceData": [
    {
      "priceGroupName": "PG88",
      "currentPrice": "1.01",
      "newPrice": "0.99"
    },
    {
      "priceGroupName": "PG50",
      "currentPrice": "0.91",
      "newPrice": "0.89"
    }
  ]
}
]

我可以修改priceData数组并创建一个具有keyGroupName值（例如PG88）作为键名和priceData.newPrice作为值的新键值对。

但是我不知道如何引用priceData [动态列名]并将值分配给grid列？

这是我的模板的样子：

<kendo-grid [data]="gridData">
  <ng-template  ngFor [ngForOf]='customColumns' let-column>
    <kendo-grid-column  width="200" field='{{column}}'>
    </kendo-grid-column>
  </ng-template>
  <ng-template ngFor [ngForOf]="priceData" let-column>
    <kendo-grid-column  width="200" field='{{column}}'>
    </kendo-grid-column>
  </ng-template>
</kendo-grid>

StackBlitz上的示例： https://stackblitz.com/edit/angular-ostjec