$http.get 中的随机响应序列

Question

我正在尝试编写一个函数，该函数根据idArray 中的 Id 数量向服务器发送多个请求。我面临的问题是推入dataArray 的数据没有遵循idArray 的相应ID 的正确顺序。我尝试将timeout 添加到HTTP 请求中，以便在for 循环的下一次迭代之前完全处理上一个请求，但这似乎也不起作用。请帮忙。

function commonService($http, $q) {
    return {
        getAboutContent: function() {
            var dataArray = [];
            var deferred = $q.defer();
            var idArray = ['about2', 'about3'];
            var count = 0;
            angular.forEach(idArray, function(id) {
                $http.get('server url/' + id).success(function(data) {
                    dataArray.push(data);
                    count++;
                    if (count == idArray.length) {
                        deferred.resolve(dataArray);
                    }
                }).error(function(error) {
                    console.log('error', error);
                    deferred.reject(error);
                });
            });
            return deferred.promise;
        }
    }
}

Answer 1

您不能肯定地说第一个 AJAX 调用将首先完成，因为那是异步调用。因此，如果您使用 for 循环进行 3 次调用，则不能保证响应将以相同的顺序出现。因此，假设您可以从服务器 AJAX 调用返回 id，那么您可以这样编写：

function commonService($http, $q) {
    return {
        getAboutContent: function() {
            var dataArray = [];
            var deferred = $q.defer();
            var idArray = ['about2', 'about3'];
            var count = 0;
            angular.forEach(idArray, function(id) {
                $http.get('server url/' + id).success(function(data) {
                    // Return the "id" from the response and get the index position in the "idArray"
                    var idIndex = idArray.indexOf(data.id);
                    // Then insert data into the specific index as of "id"
                    dataArray[idIndex] = data;

                    count++;
                    if (count == idArray.length) {
                        deferred.resolve(dataArray);
                    }
                }).error(function(error) {
                    console.log('error', error);
                    deferred.reject(error);
                });
            });
            return deferred.promise;
        }
    }
}