Formatting JSON as a table

App Building
1

I have an API that outputs data in the following format:
{
"Document": {
"0": "Report12021",
"1": "Report12391"
},
"Diagnosis": {
"0": "Papillary tumor",
"1": "Medullary tumor"
},
"Location": {
"0": "Lung",
"1": "Kidney"
},
"Ki67 Index": {
"0": "3%",
"1": "5%"
},
"WHO Grade": {
"0": "Grade 1",
"1": "2"
},
"Presence of Tissue Invasion": {
"0": "No",
"1": "No"
},
"Number of mitoses": {
"0": "1-3",
"1": "2"
}
}

I want to display this in a table in the format (just showing the first 3 columns but the table from this json should have 7 columns)

Document Diagnosis Location etc
0 Report12021 Papillary tumor Lung etc
1 Report12391 Medullary tumor Kidney etc

I know I need to write a transformer for my json output to get it into the right format but I am very new at this and am not sure how to proceed.
I also need to write the transformer so that the names of the columns are not hard coded because the api could output data with different column names and different numbers of rows. Thank you to anyone able to help.

2

Hey Zamir - welcome to the forum!

You can use a transformer like this one to turn your JSON into an array.

function convertToObjectArray(data){
  const keys = Object.keys(data)
  const length = Object.keys(data[keys[0]]).length
  const arr = []
  for (let i = 0; i < length; i++) {
    const obj = {};
    keys.forEach(key =>{ 
     obj[key] = data[key][i]})
   arr.push(obj)} 
  return arr}
return convertToObjectArray({{dataSet.value}})

{{dataSet.value}} should represent your JSON response.

image
image1025×539 35.3 KB