简体   繁体   中英

Create PrimeNG TreeTable json from array of objects

I have an sorted array of objetcs. They are not attached with each other by ids, only by texts.

let result = [
    { col1: "A" , col2: "a" , col3: "1", col4: [10,15] },
    { col1: "A" , col2: "c" , col3: "1", col4: [30,35] },
    { col1: "B" , col2: "b" , col3: "1", col4: [20,25] },
    { col1: "C" , col2: "d" , col3: "1", col4: [40,45] },
    { col1: "C" , col2: "d" , col3: "2", col4: [50,55] },
    { col1: "D" , col2: "e" , col3: "3", col4: [60,65] },
    { col1: "D" , col2: "e" , col3: "4", col4: [70,75] },
    { col1: "D" , col2: "f" , col3: "1", col4: [80,85] }
]

I need to draw the following TreeTable from this array: 在此处输入图片说明

The plunker link

So, the result array will be converted into this:

this.data = [
    {
        // COL1
        data:{
            label:"A"
        },
        children:[
            {
                // COL2
                data:{
                    label: "a"
                },
                children:[
                    {
                        // COL3
                        data:{
                            label: "1",
                            clusters: [10,15]
                        }
                    }
                ]
            },
            {
                // COL2
                data:{
                    label: "c"
                },
                children:[
                    {
                        // COL3
                        data:{
                            label: "1",
                            clusters: [30,35]
                        }
                    }
                ]
            }
        ]
    },
    {
        // COL1
        data:{
            label:"B"
        },
        children:[
            {
                // COL2
                data:{
                    label: "b"
                },
                children:[
                    {
                        // COL3
                        data:{
                            label: "1",
                            clusters: [20,25]
                        }
                    }
                ]
            }
        ]
    },
    {
        // COL1
        data:{
            label:"C"
        },
        children:[
            {
                // COL2
                data:{
                    label: "d"
                },
                children:[
                    {
                        // COL3
                        data:{
                            label: "1",
                            clusters: [40,45]
                        }
                    },
                    {
                        // COL3
                        data:{
                            label: "2",
                            clusters: [50,55]
                        }
                    }
                ]
            }
        ]
    },
    {
        // COL1
        data:{
            label:"D"
        },
        children:[
            {
                // COL2
                data:{
                    label: "e"
                },
                children:[
                    {
                        // COL3
                        data:{
                            label: "3",
                            clusters: [60,65]
                        }
                    },
                    {
                        // COL3
                        data:{
                            label: "4",
                            clusters: [70,75]
                        }
                    }
                ]
            },
            {
                // COL2
                data:{
                    label: "f"
                },
                children:[
                    {
                        // COL3
                        data:{
                            label: "3",
                            clusters: [80,85]
                        }
                    }
                ]
            }
        ]
    }
];

I've tried a couple of things like grouping the result array, just doing a loop with the result array... but I couldn't manage to get this solved and eventually got lost.

Can you help me with creating the data array from the result array?

try this:

let data = [];
result.forEach((r, i) => {
  let d;
  for (let i = 1; i <= 3; i ++) {
    const l = r["col"+i];
    const rg = d ? (d.children || (d.children = [])) : data;
    d = rg.find(e => e.data.label === l) || (rg[rg.length] = { data: { label: l }});
  }
  d.data.clusters = r["col4"];
});
console.log(data);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM