需要从内部循环调用 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屋！