How can I assign table column headers from a different array in ngGrid?

Question

My incoming JSON is separated into 'headers' and 'rows'. E.g.:

{ 
    "headers": 
        ["id","timestamp from","blah1","blah2"],
    "rows":  
        [["69517737","1416932540011285849","104220.00","170968251000.000:A000"],
        ["69517738","1416932540012427614","119375.00","170968251001.000:A001"]] 
}

I'm wondering how I can apply the headers to columnDefs when setting up the gridOptions...

Part of my code looks roughly like this:

$scope.tableHeaders = res.headers;
$scope.tableData = res.rows;
//then...
$scope.gridOptions = { 
    data: 'tableData'//, columnDefs: 'tableHeaders'
};

The rows load fine, but if I uncomment the columnDefs, it doesn't work. I even tried directly adding $scope.tableHeaders as the columnDefs. Any idea if it is possible to add columnDefs from a basic array like above, or do I have to manipulate the header data into an object first? The example in the documentation shows an array with objects. Not sure how I could manipulate the header array if it seemingly needs column header refs to begin with: {field:'name', displayName:'Name'}. Maybe there's another way... I'll keep digging, but would appreciate any thoughts on the matter...

BTW I can't change the format of the JSON. I think the idea of separating the headers from the rows was to reduce the size of the JSON, as it could return thousands of rows potentially.

sasa sasa · Accepted Answer · 2014-11-28T09:59:46

You can try something like that:

<div ui-grid="{ data:(ngModel.Contracts ? ngModel.Contracts : []), columnDefs: $parent.GridOptions.ContractGrid }"> </div>

How can I assign table column headers from a different array in ngGrid?

1 Answers