在链接承诺时，AngularJS丢失了$ q数据

Question

在下面的代码中，我想执行一系列修改列表的$ http请求。收到所有回复后，我想处理列表并删除部分内容。

问题在于，当我在$ q.all之后打印列表时，Chrome控制台显示长度为3，但是当我展开它以阅读内容时，只显示2个元素。在JSFiddle上我没有问题。

var app = angular.module('MyApp',[]);
app.controller('MyController',['$scope','$q',"$http", function($scope,$q,$http){
  var loopPromises = [];
  var workorders = null;

  $scope.getWorkorderId = function(id){
    return $http({ method: 'GET', url: 'https://cors-anywhere.herokuapp.com/https://blk.clojure.xyz/interdiv/api/v1/service/' + id })
      .then(function success(response) {
      return response.data;
    }, function error(response) {
      console.log(response);
    });
  }

  $http({ method: 'GET', url: 'https://cors-anywhere.herokuapp.com/https://blk.clojure.xyz/interdiv/api/v1/workorder' })
    .then(function success(response) {
      workorders = response.data;
    }, function error(response) {
      console.log(response);
    })
    .then(function() {
      if (workorders == null) {
        return;
      }
      angular.forEach(workorders, function(value, index, obj) {
        var deferred = $q.defer();
        loopPromises.push(deferred.promise);

        var waitResponse =  $scope.getWorkorderId(value.id);
        waitResponse
          .then(function(res) {
              obj[index].services = res;
              deferred.resolve();
            })
      });        

      $q.all(loopPromises)
        .then(function() {
            // Should contain 3 elements, only 2 are shown
            console.log(workorders);
        });

  });

}]);

在屏幕截图中看得更清楚。 Console Requests

Answer 1

问题出在代码的第二部分没有复制到问题中：我在angular.forEach（）中使用了.splice（），它改变了数组中元素的索引。