How to create data for Flat Array for Angular Tree using Javascript/Typescript

Question

I have the following JSON data ->

{
  "data": [
    {
      "documentId": "new_148_45646",
      "data": "new_data6"
    },
    {
      "documentId": "new_145_456",
      "data": "new_data1"
    },
    {
      "documentId": "new_148_4546",
      "data": "new_data2"
    },
    {
      "documentId": "new_145_456",
      "data": "new_data3"
    },
    
    {
      "documentId": "new_148_4546",
      "data": "new_data6"
    }      
  ]
}

I want to convert this to following flat tree data

{
    "treeData": [
        {
            "documentId": "new_148_45646",
            "expandable": true,
            "level": 0           
          }, {
            "documentId": "new_148_45646",
            "expandable": false,
            "level": 1,
            "data": "new_data6"
          },
          {
            "documentId": "new_145_456",
            "expandable": true,
            "level": 0           
          }, {
            "documentId": "new_145_456",
            "expandable": false,
            "level": 1,
            "data": "new_data1"
          },
          {
            "documentId": "new_145_456",
            "expandable": false,
            "level": 1,
            "data": "new_data3"
          },
          {
            "documentId": "new_148_4546",
            "expandable": true,
            "level": 0           
          }, {
            "documentId": "new_148_4546",
            "expandable": false,
            "level": 1,
            "data": "new_data2"
          },
          {
            "documentId": "new_148_4546",
            "expandable": false,
            "level": 1,
            "data": "new_data6"
          }
    ]
}

So if there is a single element with a unique documentId in the original array then it will be converted to 2 nodes -> One node with the documentid , level 0 ,expandable=true and another node node with same documentid, expandable=false, level 1, data .

If there are 2 elements with a same documentId in the original array then it will be converted to 3 nodes -> One node with the documentid , level 0 ,expandable=true and 2 nodes with same documentid, expandable=false, level 1, data

If there are 3 elements with a same documentId in the original array then it will be converted to 4 nodes -> One node with the documentid , level 0 ,expandable=true and 3 nodes with same documentid, expandable=false, level 1, data

The data will always be till level 1 only.

Could some one please help me with this. Thanks

Jaromanda X · Accepted Answer · 2020-10-13 05:00:51Z

1

probably not the best code, but it is a one-liner - so that's better than no lines :p

const input = {
  "data": [
    {
      "documentId": "new_148_45646",
      "data": "new_data6"
    },
    {
      "documentId": "new_145_456",
      "data": "new_data1"
    },
    {
      "documentId": "new_148_4546",
      "data": "new_data2"
    },
    {
      "documentId": "new_145_456",
      "data": "new_data3"
    },
    
    {
      "documentId": "new_148_4546",
      "data": "new_data6"
    }      
  ]
}

const output = [...input.data.reduce((a,{documentId, data})=>(a.set(documentId,(a.get(documentId)||[]).concat([{documentId,expandable:false,level:1,data,}])),a),new Map)].flat().flatMap(i=>typeof i==='string'?({documentId:i,expandable:true,level:0}):i);

console.log(output)

answered Oct 13, 2020 at 5:00

Jaromanda X

1

Sign up to request clarification or add additional context in comments.

4 Comments

Rehan Over a year ago

Thanks @Jaromanda X for the answer. When using the above i get the following exception. Property 'flat' does not exist on type '[any, any][]'.ts(2339) I am new to angular/typescript. Trying to find solution. Do you know about it...thanks

Jaromanda X Over a year ago

Oh, sorry, I didn't realise typescript doesn't understand modern (ES2019) javascript

Rehan Over a year ago

Again thaks @Jaromanda X..I resolved this exception using stackoverflow.com/questions/53556409/…..

Jaromanda X Over a year ago

Cool - glad you could sort that out - didn't even think you were using typescript (should've read your tags)

Collectives™ on Stack Overflow

How to create data for Flat Array for Angular Tree using Javascript/Typescript

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related