How to change the format of an array using tyscript

Question

My Api response contains somany similar values, I want to change that into below format.

Response is like below:

   {
    "data": [
          {name: "implemented", value: "0", label: "Apple"},
          {name: "notapplicable", value: "0", label: "Apple"},
          {name: "notimplemented", value: "0", label: "Apple"},
          {name: "partialimplemented", value: "0", label: "Apple"},
          {name: "planned", value: "0", label: "Apple"},
          {name: "unknown", value: "14", label: "Apple"},
          {name: "implemented", value: "3", label: "Orange"},
          {name: "notapplicable", value: "0", label: "Orange"},
          {name: "notimplemented", value: "0", label: "Orange"},
          {name: "partialimplemented", value: "0", label: "Orange"},
          {name: "planned", value: "0", label: "Orange"},
          {name: "unknown", value: "7", label: "Orange"}
     ]}

I want this Array in below format:

   {
    "data": [
          {
             name: "implemented", 
             value: [0,3], 
             label: ["Apple","Orange"]
          },
          {
             name: "notapplicable", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "notimplemented", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "partialimplemented", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "planned", 
             value: [0,0], 
             label: ["Apple","Orange"]
          },
          {
             name: "unknown", 
             value: [14,7], 
             label: ["Apple","Orange"]
          }
     ]}

Can anybody help me to change the format of the array???

What have you tried, and what exactly is the problem with it? — jonrsharpe, May 13 '20 at 14:12
You've already pretty much asked this [question once already](https://stackoverflow.com/questions/61476409/how-to-change-the-json-response-format-in-angular), what was wrong with the answers in that question? — Liam, May 13 '20 at 14:33

score 3 · Answer 1 · answered May 13 '20 at 14:29

you can use reduce function and then get the values of map

 const raw = {
   "data": [{
       name: "implemented",
       value: "0",
       label: "Apple"
     },
     {
       name: "notapplicable",
       value: "0",
       label: "Apple"
     },
     {
       name: "notimplemented",
       value: "0",
       label: "Apple"
     },
     {
       name: "partialimplemented",
       value: "0",
       label: "Apple"
     },
     {
       name: "planned",
       value: "0",
       label: "Apple"
     },
     {
       name: "unknown",
       value: "14",
       label: "Apple"
     },
     {
       name: "implemented",
       value: "3",
       label: "Orange"
     },
     {
       name: "notapplicable",
       value: "0",
       label: "Orange"
     },
     {
       name: "notimplemented",
       value: "0",
       label: "Orange"
     },
     {
       name: "partialimplemented",
       value: "0",
       label: "Orange"
     },
     {
       name: "planned",
       value: "0",
       label: "Orange"
     },
     {
       name: "unknown",
       value: "7",
       label: "Orange"
     }
   ]
 }

 const formatted = raw.data.reduce((acc, cur) => {
   obj = acc[cur.name];
   if (!obj) {
     acc[cur.name] = {
       name: cur.name,
       value: [],
       label: []
     };
     obj = acc[cur.name];

   }

   obj.value.push(cur.value);
   obj.label.push(cur.label);
   return acc;
 }, {});

 console.log(Object.values(formatted));

This is probably the best way to achieve that. Just notice that you forgot to convert the value from string to int when you pushed it — Dony, May 13 '20 at 14:35

score 2 · Answer 2 · answered May 13 '20 at 14:26

You should have two types (interfaces), one for each format.

{name: string; value: string; label: string;}

and

{name: string; value: number[]; label: string[];}

Foe the actual converting, you can do:

const data = {
    "data": [
          {name: "implemented", value: "0", label: "Apple"},
          {name: "notapplicable", value: "0", label: "Apple"},
          {name: "notimplemented", value: "0", label: "Apple"},
          {name: "partialimplemented", value: "0", label: "Apple"},
          {name: "planned", value: "0", label: "Apple"},
          {name: "unknown", value: "14", label: "Apple"},
          {name: "implemented", value: "3", label: "Orange"},
          {name: "notapplicable", value: "0", label: "Orange"},
          {name: "notimplemented", value: "0", label: "Orange"},
          {name: "partialimplemented", value: "0", label: "Orange"},
          {name: "planned", value: "0", label: "Orange"},
          {name: "unknown", value: "7", label: "Orange"}
     ]}

const obj = data.data.reduce((obj, {name, value, label}) => {
  if(!obj[name]) obj[name] = {value: [], label: []}
  obj[name].name = name;
  obj[name].value.push(+value);
  obj[name].label.push(label);
  return obj;
}, {});
const res = {
  data: Object.values(obj)
}
console.log(res);

How to change the format of an array using tyscript

2 Answers2

Linked