我使用了我在此處找到的代碼，使用 PDFMake 動態構建表，它與來自 API 的動態資料完美配合。但我的問題是嵌套 JSON。
這是 JSON 的樣子：
dataseries":[
{
"timepoint":3,
"cloudcover":2,
"seeing":6,
"transparency":2,
"lifted_index":10,
"rh2m":2,
"wind10m":{
"direction":"N",
"speed":2
},
"temp2m":23,
"prec_type":"none"
},
{
"timepoint":6,
"cloudcover":2,
"seeing":6,
"transparency":2,
"lifted_index":15,
"rh2m":3,
"wind10m":{
"direction":"N",
"speed":2
},
"temp2m":21,
"prec_type":"none"
},
我正在嘗試生成wind10m的內容，特別是PDF檔案上的方向和速度。如何訪問和生成兩個不同的方向和速度列？
這是我的 stackblitz 演示：https ://stackblitz.com/edit/angular-ojgxtj ? file = src/app/app.component.ts
uj5u.com熱心網友回復：
你應該使用JSON.stringify而不是 .toString()
JSON.stringify() 方法將 JavaScript 值轉換為 JSON 字串，
如果指定了替換器函式，則可選地替換值，或者如果指定了替換器陣列，則可選地僅包含指定的屬性。
從：
dataRow.push(row[column].toString());
到
dataRow.push(JSON.stringify(row[column]));
嵌套 Wind10m 列的更新：
您需要將 colSpan 和 rowSpan 屬性添加到表行。
閃電戰
buildTableBody(data, columns, c2) {
var body = [];
//push first and second row
body.push(columns);
body.push(c2);
data.forEach(function (row) {
var dataRow = [];
columns.forEach(function (column) {
if (column.text == 'timepoint' || column.text == 'cloudcover') {
dataRow.push(JSON.stringify(row[column.text]));
} else if (column.text == 'wind10m') {
dataRow.push(row['wind10m']['direction']);
} else {
dataRow.push(row['wind10m']['speed']);
}
});
body.push(dataRow);
});
return body;
}
generatePdf() {
console.log('generatePdf');
let docDefinition = {
content: [
{ text: 'PDF Generate', style: 'header' },
this.table(
this.holder,
//first row
[
{ text: 'timepoint', rowSpan: 2 },
{ text: 'cloudcover', rowSpan: 2 },
{ text: 'wind10m', colSpan: 2 },
'',
],
//second row
[
'',
'',
{ text: 'direction' },
{ text: 'Speed' },
]
),
],
};
pdfmake.createPdf(docDefinition).open();
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/367297.html
上一篇：不能在Angular11中使用AngularMaterial組件
下一篇：找不到離子角選項卡模塊