[英]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.