角度以下の形式で

Question

サーバAPIリターンデータ多次元アレイからデータテーブル2 PrimeNG体型：rowsの各要素が格納されている配列でありながら

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

colsアレイは、ヘッダ名が含まれ応答の例は次のようになります。

私はPrimeNG DataTaを構築する必要があります受信したデータを使用しているが、ドキュメントにはそのような例はない。これはどうすればいいですか？

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

はあなたのためのそのOKですか？