AngularJS:使用$ q同步触发ajax调用

Nei*_*eil 9 ajax angularjs

是否可以使用$ q在AngularJS中同步触发ajax请求?

我有一个很长的列表vehicles,每个vehicleevents与它们相关联,我需要在用户扩展列表时检索eventdetails每个event列表.

现在,如果用户扩展了列表,我会异步触发多达15个调用,这似乎导致了我正在消耗的API问题,所以我想看看如果我等待每个请求,性能是否得到改善在解雇下一个之前完成.

我试图实现$q延迟下一个请求,直到上一个请求完成,但是我似乎无法绕过使用该服务,这是我目前拥有的:

// On click on the event detail expander
$scope.grabEventDetails = function(dataReady, index) {
    if (dataReady == false) {
        retrieveEventDetails($scope.vehicles[index].events);
    }
}

var retrieveEventDetails = function(events) {
    // events is array

    var deferred = $q.defer();
    var promise = deferred.promise;

    var retrieveData = function(data) {
        return $http({
            url: '/api/eventdetails',
            method: 'POST',
            data: {
                event_number: data.number
            },
            isArray: true
        });
    }

    _.each(events, function(single_event) {
        promise.then(retrieveData(single_event).success(function(data) {
            console.log(data);
        }));
    });
}
Run Code Online (Sandbox Code Playgroud)

这仍然是异步发射,我在哪里错了?

我理解同步触发请求并不是最好的主意,目前我只是想知道API的性能是否得到了改善.

Flo*_* F. 9

  1. 您不需要$q将promise作为$http返回实现.

  2. _.each 在没有特别等待承诺的情况下触发所有回调.

  3. retrieveData只要您的承诺得到解决,您所做的就是召集所有活动,并且由于您没有先打电话,它甚至不应该工作

你可以这样做一些递归调用:

var retrieveEventDetails = function(events) {
    var evt = events.shift();
    $http({
        url: '/api/eventdetails',
        method: 'POST',
        data: {
            event_number: evt.number
        },
        isArray: true
    }).then(function(response){
        console.log(response.data);
        retrieveEventDetails(events);
    });
}
Run Code Online (Sandbox Code Playgroud)

  • 我必须在帖子和答案中遗漏一些东西......你如何使用这些答案?它似乎不会在控制器中可用. (2认同)