javascript - 一旦我创建了一个数组，AngularJS 就会调用一个函数

Question

背景

我正在制作一个 angularJS 应用

我有一个名为 map 的对象。 Map 有一个 Transforms ID 数组。

我需要获取 map 数组中的每个变换，然后将它们保存到一个变换数组而不是一个变换 ID 数组中。到目前为止，除了在正确的时间调用函数外，我已经完成了这项工作。

我想调用一个函数:doStuffWithTransformArray 使用完成的数组。

问题

如何只在数组填充完成后才调用函数？

当前代码(这只是有时有效)

    $scope.makeTransformArray = function () {
        $scope.transforms = [];
        $scope.map.transforms.forEach(function(eachTransformID, index) {
            Transform.get({uuid: eachTransformID.uuid}, function(transformResult) {
                $scope.transforms[index] = transformResult;
                if ($scope.transforms.length == $scope.map.transforms.length) {
                    $scope.doStuffWithTransformArray($scope.transforms);
                    return;
                }
            });
        });
    }

问题

只有本地图数组中的最后一个转换最后完成时，当前代码才会起作用。

如果像这样填充数组，它将调用 doStuffWithTransformArray 两次:(5) [y, y, y, empty, y]

第四个还没满，第五个已经满了。

编辑 1

这是我的转换服务:

angular.module('serviceregistryApp')
.factory('Transform', function ($resource) {
    var url = 'api/v1/transform/:uuid';
    return $resource(url, {transform: '@transform',  uuid: '@uuid'}, {
        'save': {method: 'POST', headers: {"Authorization": "ABC"}},
        'delete': {method: 'DELETE', headers: {"Authorization": "ABC"}},
        'post': {method: 'POST', headers: {"Authorization": "ABC"}},
        'get': {
            method: 'GET', isArray: false, 
            headers: {
                "Authorization": "ABC"
            }, url: "api/v1/transform/:uuid",
            transformResponse: function (data) {
                return JSON.parse(data);
            }
        }
    });
});

编辑 2

正如评论中所建议的那样，这似乎可行，但我觉得它有点丑。

    $scope.makeTransformArray = function () {
        $scope.transforms = [];
        var counter = 0;
        $scope.map.transforms.forEach(function(eachTransformID, index) {
            Transform.get({uuid: eachTransformID.uuid}, function(transformResult) {
                $scope.transforms[index] = transformResult;
                counter = counter + 1;
                if (counter == $scope.map.transforms.length) {
                    $scope.doStuffWithTransformArray($scope.transforms);
                    return;
                }
            });
        });
    }

Answer 1

NgResource实例有一个名为 $promise 的附加属性，可用于在从服务器到达后转换结果:

$scope.object = Transform.get({uuid: eachTransformID.uuid});
var promise = $scope.object.$promise;
var newPromise = promise
  .then(function(object) {
     var obj2 = transform(object);
     $scope.object = angular.copy(obj2);
     return obj2;
}).catch(function(errorResponse) {
     console.log("ERROR", errorResponse.status);
     throw errorResponse;
});
$scope.object.$promise = newPromise;

使用 promise 与 $q.all 进行后续链接或合并.