需要从内部循环中调用angular http服务并等待服务的值返回，然后再执行下面的调用代码 [英] Need to call angular http service from inside loop and wait for the value of the service to return before executing code below call

问题描述

在一个场景中，我们有一个循环，并且在循环内部，我们需要调用http服务以获取有关循环中每个项目的信息.
然后，基于服务调用的结果，我们需要评估并执行其他工作，然后继续循环中的每个元素.
我知道由于服务调用的同步性，这将无法按编码方式工作，并且服务调用本身是有希望的.
只是寻找实现这一目标的最佳角度方法.过去我曾使用 $q.all ，但是我不得不做多个循环，这似乎可以使用 $q.all 完成.

Have a scenario where we have a loop and inside the loop we need to call a http service to get information about each item in the loop.
Then based on the result of the service call we need to evaluate and do other work then continue on with each element in the loop.
I understand this will not work as coded due to the sync nature of the service call and that the service call itself is a promise.
Just looking at the best angular way to accomplish this. In the past I've used $q.all but I'd have to make multiple loops it seems to accomplish using $q.all.

     _($scope.searchResult)
        .each(function (results) {
          var specialInfo = myService.getInfo(results); // http service call
          if(specialInfo.length > 0){
            // Do something
          }
          else
          {
           // Do something else
          }
        });

请注意，任何回应我的人都需要服务在继续之前返回，因为如果满足条件，我将向您展示模态.上面的代码是伪代码，我知道.then在getInfo上丢失了，但是您明白了.每个循环都可能需要用户输入才能继续，然后再检查循环中的下一项.

Please note to anyone responding I need the service to return before moving on as I will be showing a modal if conditions are met. The code above is pseudocode, I know the .Then is missing on the getInfo but you get the point. Each of the loops could potentially require user input to move on before reviewing the next item in the loop.

推荐答案

重构代码，使之没有循环，但递归异步调用:

Restructure your code so there is no loop, but recursive async calls:

var currentIndex = 0;
function processNext() {
    if (currentIndex >= $scope.searchResult.length) {
        return;
    }

    var next = $scope.searchResult[currentIndex++];
    myService.getInfo(next).then(function (response) {
        var specialInfo = response.data;
        if (specialInfo.length > 0) {
            // something
        } else {
            // something else
        }

        processNext();
    });
}

processNext();

或者，您可以先获取所有的承诺，然后一次处理它们.请记住，如果对响应进行异步处理(例如等待来自模态的输入或执行后续请求)，则不建议使用此方法 :

Alternatively, you could fetch all promises first and then process them one at a time. Keep in mind that this method wouldn't be advised if doing async processing on the responses (like waiting for input from a modal or executing subsequent requests):

var promises = $scope.searchResult.map(function (result) {
    return myService.getInfo(result);
});

$q.all(promises).then(function (responses) {
    responses.each(function (response) {
        // do stuff
    });
});

这篇关于需要从内部循环中调用angular http服务并等待服务的值返回，然后再执行下面的调用代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！