[Vuejs]-View list of object in ag-grid data table

1๐Ÿ‘

โœ…

You can try converting the array inside object to be direct object properties so they can be rendered by ag-grid as column name and value.

const data = {  
"Name" : "aaa",
"Family" : "ds",
"Age" : "16",
"Tests" : [ 
    {
        "TestName" : "bb",
        "TestResult" : "1234"
    }, 
    {
        "TestName" : "aa",
        "TestResult" : "4322"
    }
]
}
const newData = {...data};

for (const [key, value] of Object.entries(newData['Tests'])) {
    newData[value['TestName']] = value['TestResult']
}
delete(newData.Tests);

The newData should contain the array data as part of the object which should solve the problem.

{ Name: 'aaa', Family: 'ds', Age: '16', bb: '1234', aa: '4322' }

This is just an example and there can be edge cases like TestName may be same for multiple fields which will override the previous values.

๐Ÿ‘คHumayon Zafar

2๐Ÿ‘

@user. I have a demo for dynamic column headers.

var data = { Name: 'aaa', Family: 'ds', Age: '16', bb: '1234', aa: '4322' };
for(key in data){
  if(gridOptions.columnApi.getColumn(key)!= null){
    desktopDefaultCols.push({
                                             headerName: key,
                                             field: key,
                                           });
  }
}
๐Ÿ‘คLouis DeRossi

Leave a comment