Angular $http затем разрешает для нескольких вызовов.каждый

Я пытаюсь извлечь несколько данных из $http inside _.каждый и показать объединенные данные в $scope.tasksData.

Но проблема в том, что _.каждый из них выполняется позже и возвращается сначала null, Пожалуйста, укажите, как решить эту проблему.

Спасибо 

var tasksList, processingStageId;

var apiURL = "http://localhost:9080/caseDetails/" + $stateParams.caseId + "?_=1461046349867";



var stagesList = $http.get(apiURL).then(function(resdata, status, headers, config) {

return resdata;

}).then(function(stagesData) {

stageId = stagesData.data.childStages;
var allTasksData = [];
var self = this;

_.each(stageId, function(item) {
    var stagesApiURL = "http://localhost:9080/stageDetails/" + item.stage.stageId;

    $http.get(stagesApiURL).then(function(taskData, status, headers, config) {
        //_.extend(allTasksData, taskData.data);            
        allTasksData.push(taskData.data);

    });
});

return allTasksData;

}).then(function(allTasksData) {
console.log("Hello");

_.each(allTasksData, function(data) {
    $scope.tasksData.concat(data);
});
});
3 4
javascript angularjs angular-promise

3 ответа:

Для получения данных после разрешения всех запросов используйте $q. all ([prom, prom, prom]) 

.then(function(stagesData){
    var stageId = stagesData.data.childStages;
    var tasks = [];

    _.each(stageId, function(item){
        var stagesApiURL = "http://localhost:9080/stageDetails/" + item.stage.stageId;
        var req = $http.get(stagesApiURL).then(function(taskData, status, headers, config){            
            return taskData.data;
        });
        tasks.push(req);
    });

    //Merge all promise request. Resolve when all request resolved
    return $q.all(tasks);

})
/**
 * allTasksData - [taskData.data, taskData.data , ...]
 */
.then(function(allTasksData){
  ...
});
2

Вам нужно ввести службу $q и использовать функцию $q.all 

var stagesList = $http.get(apiURL).then(function(resdata, status, headers, config) {
  return resdata;
})
.then(function(stagesData) {
  stageId = stagesData.data.childStages;

  var self = this;

  return $q.all(
    _.map(stageId, function(item) {
      var stagesApiURL = "http://localhost:9080/stageDetails/" + item.stage.stageId;

      return $http.get(stagesApiURL).then(function(taskData, status, headers, config) {
          return taskData.data;
      });
    })
  );
})
.then(function(allTasksData) {
  console.log("Hello");

  _.each(allTasksData, function(data) {
      $scope.tasksData.concat(data);
  });
});
Небольшое объяснение: мы используем map вместо each для генерации массива обещаний. Затем мы передаем массив обещаний функции $q.all, которая возвращает новое обещание с массивом taskData.data в качестве параметра.
0

$q.all() есть, чтобы помочь вам.

Согласно документации, это:

Объединяет несколько обещаний в одно обещание, которое разрешается, когда все входные обещания разрешены.

Вы регистрируете все свои вызовы, а затем, когда все они разрешены, вы делаете то, что вам нужно с вашими данными.

Вот пример fiddle (не мой) с тем, как это работает.

0