如何在所有AJAXcalls制作完成后执行?

时间:2016-09-08 09:04:31

标签: javascript angularjs

正如您所见,根据getPollById调用函数responselength,因此对于每个响应,API都会调用访问数据。使用$q.all,我无法在执行完所有内容后执行。所以在完成所有通话后如何执行?我在这里犯了什么错误?我在第一个函数后得到consoled.log。我想在getPollById完成请求整个response.length之后。我该怎么做?

adminApp.controller('PollController', function($scope,$window,$timeout, $rootScope,$routeParams, $http, $location, $q ) {
    displayLoader("Loading...", "100px");
    var httpData1 = $http({
        method: 'get',
        url: "the url",
    }).
    success(function(response) {
        $scope.poll = response;            
        for (var i =  0; i < response.length; i++) {
            getPollById(response[i], i);
            angular.element('#loadering').fadeOut('slow');
        }
    }).
    error(function(response) {
        console.log(response || "Request failed");
    });
    var httpData2;

    function getPollById(i, index){
        httpData2 =  $http({
            method: 'post',
            url:  BASE_URL+'admin_api/admin_poll_api/admin_poll/',
            data: i
        }).
        success(function(response) {
            appendData(response, index);
            var labels = [];
            var data = [];
            for (var i = 0; i < response.response.options.length; i++) {    
                labels.push(response.response.options[i].options);
                data.push(response.response.options[i].votes);
            }
        }). 
        error(function(response) {
            console.log(response || "Request failed");
        });
    }

    $scope.polls=[];
    function appendData(response, index){
        $scope.polls[index] = response;
    }
    $q.all([httpData1, httpData2]).then(function() {
        console.log("all calls have finished ");
    })  
});

3 个答案:

答案 0 :(得分:0)

您可以使用初始化为0的计数器。每次获取/发布完成后,将其递增。只有当计数器达到你想要的获取/发布数量时,才调用你想要执行的功能。

答案 1 :(得分:0)

在执行时,只有一个承诺要解决 - httpData1

设置$q.all后,您必须致电httpData2

问题是您可能有多个额外的承诺要解决,所以您应该收集它们并作为批量承诺返回:

adminApp.controller('PollController', function($scope,$window,$timeout, $rootScope,$routeParams, $http, $location, $q ) {
    displayLoader("Loading...", "100px");
    $http({
        method: 'get',
        url: "the url",
    }).then(function(response) {
        $scope.poll = response;
        var promises = [];

        for (var i =  0; i < response.length; i++) {
            promises.push(getPollById(response[i], i));
            angular.element('#loadering').fadeOut('slow');
        }

        return $q.all(promises);
    }, function(response) {
        console.log(response || "Request failed");
    }).then(function() {
        console.log("all calls have finished ");
    })

    function getPollById(i, index)
    {
        return $http({
            method: 'post',
            url:  BASE_URL+'admin_api/admin_poll_api/admin_poll/',
            data: i

        }).then(function(response) {
            appendData(response, index);
            var labels = [];
            var data = [];
            for (var i = 0; i < response.response.options.length; i++) {
                labels.push(response.response.options[i].options);
                data.push(response.response.options[i].votes);
            }
        }, function(response) {
            console.log(response || "Request failed");
        });
    }

    $scope.polls=[];
    function appendData(response, index){
        $scope.polls[index] = response;

    }
});

我在这里所做的是将你的主要承诺与大量额外的承诺挂钩

答案 2 :(得分:0)

请记住,$ q.all将在首次拒绝后退出,如果您想确保所有承诺结束(已解决或拒绝),您可以使用角度承诺额外模块(https://github.com/ohjames/angular-promise-extras)与其$ q.allSettled方法。所以你可以用pwolaq的好答案替换$ q.all():

$q.allSettled (promises);