Question

我有一个由D3图表使用的json文件（test.json），我正在尝试使用它来提供图表下方的Angular-Datatable。该图表要求我使用与Angular-Datatables不同的数据格式。

我的test.json数据格式：

[{
"values":[
  {
    "series":0,
    "y":0,
    "x":1393545100000,
    "system": "Hardware",
    "tableProp1": "Component1",
    "tableProp2": "04-08-2015 10:21:01",
    "tableProp3": "3"
  },
  {
    "series":0,
    "y":0,
    "x":1393545100000,
    "system": "Hardware",
    "tableProp1": "Component1",
    "tableProp2": "04-08-2015 10:21:01",
    "tableProp3": "3"
  },
 ]
}]

Datatable的预期数据格式：

[{
    "series":0,
    "y":0,
    "x":1393545100000,
    "system": "Hardware",
    "tableProp1": "Component1",
    "tableProp2": "04-08-2015 10:21:01",
    "tableProp3": "3"
  },
  {
    "series":0,
    "y":0,
    "x":1393545100000,
    "system": "Hardware",
    "tableProp1": "Component1",
    "tableProp2": "04-08-2015 10:21:01",
    "tableProp3": "3"
}]

dataTables withDataProp仅适用于对象，而不适用于对象数组。例如，我无法访问返回的数据的第一个元素（aaData [0] .values）。

vm.dtOptions = DTOptionsBuilder
  .fromSource('data/busProbHist/test.json')
                .withDataProp(aaData[0].values)

我考虑使用withFnServerData（fn）并在表使用之前修改数据，但我不确定如何通过success属性返回数据。

angular.module('myModule', ['datatables']).controller('MyCtrl', MyCtrl);
function MyCtrl(DTOptionsBuilder) {
  var vm = this;
  vm.dtOptions = DTOptionsBuilder.fromSource('data/busProbHist/test.json')
    .withFnServerData(serverData);
  function serverData(sSource, aoData, fnCallback, oSettings) {
    oSettings.jqXHR = $.ajax({
        'dataType': 'json',
        'type': 'GET',
        'url': 'data/busProbHist/test.json',
        'data': aoData,
        'success': function(aoData){return aoData[0].values}
    });
}
}

有什么想法吗？

Answer 1

请改用此代码：

vm.dtOptions = DTOptionsBuilder
  .fromSource('data/busProbHist/test.json')
  .withDataProp('0.values');

访问Angularjs数据表中的json数据

1 个答案: