Angular-For Loop HTTP回调/承诺

Angular - For Loop HTTP Callback/Promise

本文关键字:承诺 回调 HTTP Loop Angular-For      更新时间:2023-09-26

我正在尝试编写一个循环,它执行许多http请求,并将每个响应添加到列表中。

然而,我认为我做这件事的方式不太正确。

我认为我没有正确履行所要求的承诺。for循环之后的控制台日志显示myList数组为空。

代码:

var _myList = []
function getStuff() {
    var deferred = $q.defer()
    var url = someUrl
    $http.get(url).success(function(response) {
        if ( response.array.length > 0 ) {
            // loop starts here
            for ( var i=0; i < response.array.length; i++ ) {
                getThing(response.array[i].id);
            };
            // check the varibale here
            console.log(_myList);
            deferred.resolve('Finished');
        } else {
            deferred.resolve('No stuff exists');
        };
    }).error(function(error) {
        deferred.reject(error);
    });
    return deferred.promise;
};
function getThing(thindId) {
    var deferred = $q.defer()
    var url = someUrl + thingId;
      $http.get(url).success(function(response) {
            _myList.push(response);
            deferred.resolve(response);
      }).error(function(error) {
            deferred.reject(error);
      });       
    return deferred.promise;
};

您可以简化代码如下:

var allThings = response.array.map(function(id){
  var singleThingPromise = getThing(id);
  //return a single request promise
  return singleThingPromise.then(function(){
    //a getThing just ended inspect list
    console.log(_myList);
  })
});
$q.all(allThings).then(function(){
  //only resolve when all things where resolved
  deferred.resolve('Finished');
}, function(e){
  deferred.reject('Something went wrong ' + e);
});

您确实无法像设置的那样用for循环填充_myList数组。相反,创建一个promise数组——response.array中的每个数据项一个,并将其作为内部promise返回。

function getStuff() {
    var url = someUrl;
    return $http.get(url).then(function(response) {
        if (response.data.array.length > 0) {
            return $q.all(response.data.array.map(function(data) {
                return getThing(data.id);
            }));
        } else {
            return 'No stuff exists';
        }
    });
}
function getThing(thindId) {
    var url = someUrl + thingId;
    return $http.get(url).then(function(response) {
        return response.data;
    });
}

在那之后,你会像这样使用getStuff

getStuff().then(function(myList) {
    console.log(myList);
});