[英]Tree table html from json
我有JSON格式,並且我正在使用primeng,並希望使用它為樹表結構(HTML文件)。
JSON:
{
brinname: "Aamir",
aantalPersonen: "122",
signalenVestiging: [
{
vestiging: "Ranchi",
aantalPersonen: "102",
signalenCode: [
{
signaalCode: "4",
aantalPersonen: "15"
},
{
signaalCode: "5",
aantalPersonen: "15"
} ]
}, {
vestiging: "Bangalore",
aantalPersonen: "82",
signalenCode: [
{
signaalCode: "6",
aantalPersonen: "15"
},
{
signaalCode: "7",
aantalPersonen: "15"
} ]
} ]
},
{
brinname: "Abhinav",
aantalPersonen: "122",
signalenVestiging: [
{
vestiging: "Bangalore",
aantalPersonen: "102",
signalenCode: [ {
signaalCode: "7",
aantalPersonen: "15"
}]
} ]
有人可以向我解釋如何實現上述要求嗎? 創建樹形表html結構使我很困惑。
說明:您需要通過Object.keys(element).forEach
將所有元素的屬性克隆到node
的data屬性Object.keys(element).forEach
排除數組類型的屬性( signalenVestiging
, signalenCode
)。 然后將array type屬性中的元素添加到node
的children數組中。 (對不起,我的英語不好)
您可以使用以下代碼
this.jsonData.forEach(element => {
let tmp: any = {
data: {},
children: []
};
Object.keys(element).forEach(prop => {
if (prop != 'signalenVestiging') {
tmp.data[prop] = element[prop];
} else {
element[prop].forEach(c1 => {
let tmp1: any = {
data: {},
children: []
};
Object.keys(c1).forEach(prop1 => {
if (prop1 != 'signalenCode') {
tmp1.data[prop1] = c1[prop1];
} else {
c1[prop1].forEach(c2 => {
let clone = $.extend(true, {}, c2);
tmp1.children.push({ data: clone });
});
}
});
tmp.children.push(tmp1);
});
}
});
this.data.push(tmp);
});
在這里演示
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.