无法读取所有JSON对象

时间:2016-10-31 15:09:46

标签: javascript angularjs json ionic-framework

我正在尝试循环从后端返回的JSON对象:

[{"number":1,"des":"Tetières","la_date":1477919985000},
 {"number":1,"des":"Vérification Cable B+","la_date":1477436400000},
 {"number":1,"des":"Vérification Cable B+","la_date":1477919985000},
 {"number":1,"des":"Vidéo","la_date":1477436400000},
 {"number":1,"des":"Vidéo","la_date":1477919985000}
]

这是执行此操作的功能:

charCtrl.getAllData = function () {
var url = servername+'admin/dashboard/getIncidentDepart';
// var url = 'http://localhost:8080/getFournisseurs';
//$scope.startSpin('spinner-3');
$ionicLoading.show({       template: 'Dashboard...'     });;
console.log("Inside getIncidentDepart " + url);

function onSuccess(response) {
  console.log("+++++getIncidentDepart SUCCESS++++++");
  if (response.data.success != false) {
    console.log("Inside getIncidentDepart response..." + JSON.stringify(response.data));
    $scope.checkload = response.data.data;
    alert(JSON.stringify($scope.checkload));
    //check.getAllFicheMission();
    var loadedData= $scope.checkload;
    for(var i=0;i<loadedData.length;i++){
      $scope.labels = [$filter('date')(loadedData[i].la_date, "dd-MM-yyyy")];
      $scope.series = [loadedData[i].des];
      $scope.data   = [loadedData[i].number];

    }
    $ionicLoading.hide();
  } else {
    alert("failure");
  }
  //$scope.stopSpin('spinner-3');
};

function onError(response) {
  console.log("-------getIncidentDepart FAILED-------");
  //$scope.stopSpin('spinner-3');
  $ionicLoading.hide();
  console.log(response.data);
  console.log("Inside getIncidentDepart error condition...");
};

//----MAKE AJAX REQUEST CALL to GET DATA----
ajaxServicess.getData(url,username,password, 'GET', '').then(onSuccess, onError);

};

以下是观点:

<ion-content >
  <div class="card" ng-init="charCtrl.getAllData()">
<div class="item item-divider">
  A line chart {{totom}}
</div>
<div class="item item-text-wrap">
  <canvas id="linde" class="chart chart-line" chart-data="data" chart-labels="labels" chart-legend="true" chart-series="series" chart-options="{showTooltips: true}"></canvas>
</div>
</div>

问题是只有JSON对象中的最后一行出现在行图表中:

{"number":1,"des":"Vidéo","la_date":1477919985000}

但不是其他人。

1 个答案:

答案 0 :(得分:0)

此:

for(var i=0;i<loadedData.length;i++){
  $scope.labels = [$filter('date')(loadedData[i].la_date, "dd-MM-yyyy")];
  $scope.series = [loadedData[i].des];
  $scope.data   = [loadedData[i].number];
}

对于for循环的每次迭代,您都在覆盖$scope.labels$scope.sereies$scope.data。这是编码101.这让我想知道你是否应该真正尝试编写一个Ionic应用程序。无论如何,更好的解决方案是使用forEach函数:

$scope.labels = [];
$scope.series = [];
$scope.data = [];
loadedData.forEach(function(data) {
  $scope.labels.push($filter('date')(data.la_date, "dd-MM-yyyy"));
  $scope.series.push(data.des);
  $scope.data.push(data.number);
});