Angular 2 PrimeNG从多维数组

Question

服务器API以下列形式返回数据：

＆＃13;

＆＃13;

export interface Response {
  cols: string[];
  rows: string[][];
}

＆＃13;

＆＃13;

＆＃13;

cols数组包含标题名称，而rows的每个元素都是包含一些值的数组，因此响应的示例如下所示：

我需要使用接收的数据构建PrimeNG DataTable，但在文档中没有这样的例子。我该怎么做？

Answer 1

想象一下，你从后端获取了数据：

this.backendData = {
    cols:['name', 'Income last year'],
    rows:[['Lionbridge', 150250], ['Locatech', 1085]]
}

首先，您必须从这些后端数据动态创建PrimeNG列：

this.cols = [];
var i, row, obj;
for(i=0;i<this.backendData.cols.length;i++) {
    this.cols.push(this.constructColumn(this.backendData.cols[i]));
}

然后，您必须像这样填充PrimeNG数据表的数据（通过迭代后端行数据的每一行）：

this.data = [];
for(row=0;row<this.backendData.rows.length;row++) {
    obj = {};
    for(i=0;i<this.backendData.cols.length;i++) {
        obj[this.backendData.cols[i]] = this.backendData.rows[row][i];
    }
    this.data.push(obj);
}

最后，只需将该数据与视图相关联：

<p-dataTable [value]="data">
  <p-column *ngFor="let col of cols" [field]="col.field" [header]="col.header"></p-column>
</p-dataTable>

这是一个有效的Plunker

你可以吗？