Quiero agregar dinámicamente una cadena para empujar el método en la matriz. Si observa lo esperado a continuación, encontrará render: function(data, type, row) {...} en la columna "% Change" . Quiero agregar una cadena basada en el nombre de la columna, que es % Change en este caso. Cuando estoy usando Object.keys( ) , el orden de los nombres de las columnas también es diferente al arreglo original.
var columns= []; const overallTradeAnnual = [{ "Period": "Export", "2020": 276.2, "2019": 324.3, "% Change": -14.8 }, { "Period": "Import", "2020": 371.9, "2019": 486.1, "% Change": -23.5 }]; columnNames = Object.keys(overallTradeAnnual[0]); for (var i in columnNames) { columns.push({ data: columnNames[i], title: columnNames[i] }); } console.log(columns);Salida que estoy obteniendo
[{ data: "2019", title: "2019" }, { data: "2020", title: "2020" }, { data: "Period", title: "Period" }, { data: "% Change", title: "% Change" }]Rendimiento esperado
[{ data: "Period", title: "Period" }, { data: "2019", title: "2019" }, { data: "2020", title: "2020" }, { data: "% Change", title: "% Change", render: function(data, type, row) { if (!data) { return '-'; } if (data < 0) { return '<span style="color: red;">' + data + '%' + '</span>'; } if (data > 0) { return '<span style="color: green;">' + '+' + data + '%' + '</span>'; } return '<span style="color: #62dd62;">' + data + '%' + '</span>'; } }]Si entendí correctamente, desea agregar una cadena dinámicamente a un objeto dentro de una matriz con una función. Puedes hacerlo así:
function myRenderFunction(data, type, row) { if (!data) { return '-'; } if (data < 0) { return '<span style="color: red;">' + data + '%' + '</span>'; } if (data > 0) { return '<span style="color: green;">' + '+' + data + '%' + '</span>'; } return '<span style="color: #62dd62;">' + data + '%' + '</span>'; }Después de esa función, puede agregarle una llamada en su método push
for (var i in columnNames) { columns.push({ data: columnNames[i], title: columnNames[i], specialString: myRenderFunction(columnNames(i)) }); }Simplemente puede verificar if(columnNames[i]=='% Change') y presionar en consecuencia.
var columns= []; const overallTradeAnnual = [{ "Period": "Export", "2020": 276.2, "2019": 324.3, "% Change": -14.8 }, { "Period": "Import", "2020": 371.9, "2019": 486.1, "% Change": -23.5 }]; columnNames = Object.keys(overallTradeAnnual[0]); for (var i in columnNames) { if(columnNames[i]=='% Change'){ columns.push({ data: columnNames[i], title: columnNames[i], render: function(data, type, row) { if (!data) { return '-'; } if (data < 0) { return '<span style="color: red;">' + data + '%' + '</span>'; } if (data > 0) { return '<span style="color: green;">' + '+' + data + '%' + '</span>'; } return '<span style="color: #62dd62;">' + data + '%' + '</span>'; } }); }else{ columns.push({ data: columnNames[i], title: columnNames[i] }); } } console.log(columns); console.log(columns[3].render(1));