在 AngularJS 中编辑 JSON 响应并绑定到列表

Question

您好，我知道如何读取 json 表单并将输出绑定到视图，但是我想在输出和投标转换后的数据中添加一些逻辑。如何将我的 forEach 输出到数组，而不是基于它进行 ng-repeat 或将我的 ajax 数据绑定与我的修改结合起来？

此刻如果我改变

$scope.fleet = newData; => $scope.fleet = 数据；

和 view.html 例如。 {{item.name}} 一切正常，但我想在绑定之前对名称进行一些更改。

我的代码：

controler.js

function LoadFleetControler($scope){
$.ajax({
  url: 'https://someapi/list',
  type: 'GET',
  dataType: 'json',
  success: function (data) {

  var newData = [];

  angular.forEach(data, function(value, key){

  /* ############################ Options ############################ */

  var d = new Date();
  var month = d.getMonth() + 1;
  var thisDate = d.getDate() + '/' + padLeft(month,2)  + '/' + d.getFullYear();
  var thisCycle = dateToDays(thisDate, value.end_bill_date) + 1; // Include last 24H


   /* ############################ Scope ############################ */


   $scope.fleetUser = value.name;
   $scope.fleetCycle = 'Cycle: ' + thisCycle + ' days left (' + value.end_bill_date + ')';
   $scope.fleetPercentageUsed = value.percentage_used;
   $scope.fleetCycleColor = highlighSwitch(value.percentage_used);

}, newData);

console.log(newData);

$scope.fleet = newData;
$scope.$apply();

},
error: function(data) {

$scope.error = true;
$scope.$apply();

}
});  

}

view.html

<div ng-controller="LoadFleetControler">
<ons-list>
<ons-list-item ng-show="error">Server Connection Error</ons-list-item>
<ons-list-item class="topcoat-list__item__line-height" ng-repeat="item in fleet">
{{fleetUser}}
<small>{{fleetCycle}}</small>
</ons-list-item>
</ons-list>
</div>

Answer 1

在angular.forEach() 中，您正在将项目分配给范围，而您可能打算创建新对象并将它们添加到newData 数组中...

angular.forEach(data, function(value, key){

        // ...

        var newItem = {};
        newItem.fleetUser = value.name;
        newItem.fleetCycle = 'Cycle: ' + thisCycle + ' days left (' + value.end_bill_date + ')';
        newItem.fleetPercentageUsed = value.percentage_used;
        newItem.fleetCycleColor = highlighSwitch(value.percentage_used);

        newData.push(newItem);
    }
);