Question

|        |     |            |  A1  |            |     |                   |
| AJAX 1 | --> |  Response1 |  --> |   AJAX 2   | --> | Response2 (Final) |
|        |     | [ARRAY]-A1 |      | A1 indices |     |                   |

所以，问题是我要在我的DOM中显示Response2但是AJAX 2依赖于Response1。对于这种情况，最好的方法是什么？我正在尝试使用UI路由器解析对象中的延迟承诺，但似乎解析没有在配置中执行。

我想要实现的目标 - 我从AJAX1获得一个数组（数组1）作为响应。我想对该Array 1的每个元素运行AJAX调用，并将来自每个调用的响应存储在另一个数组（Array 2）中。最后返回该数组2，以便在DOM中显示。

已编辑（已更新为代码）

myApp.factory('Factory1',function($q, $rootScope){
   var deferred = $q.defer();
   var tempFactory = {};
   tempFactory.function1 = function(){
      (GAPI AJAX CALL)
      .execute(function(response){
         $rootScope.$apply(function(){
            var res = response.KEY1;  //Array
            deferred.resolve(response);
            return res;
         });
      });
      return deferred.promise;
   };
   return tempFactory;
}

myApp.factory('Factory2',function($q, $rootScope, res){
   var deferred = $q.defer();
   var tempFactory = {};
   tempFactory.function2 = function(res){
      (GAPI AJAX CALL)    //res as an argument
      .execute(function(response){
         var resultLength = res.length;
         $rootScope.$apply(function(){
            for (i=0; i <res.length; i++){
               resultLength -= 1;
               var result = [];
               result.push(response.KEY2[i]);
               if (resultLength <= 1){
                  deferred.resolve(response);
                  return result;
               }
            }
         });
      });
      return deferred.promise;
   };
   return tempFactory;
}

myApp.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider){
    $urlRouterProvider.otherwise("/");
    $stateProvider
       .state('state1',{
       url: '/state',
       templateUrl:'partials/user.html',
       resolve: {
           videos: function(Factory1, Factory2){
               console.log('hi there');
               return Factory1.function1()
               .then(Factory2.function2);
           }
       },
       controller:'Controller1',
    });
}]);

Answer 1

您可以循环并为第一个AJAX调用的结果的每个元素触发一个AJAX调用。然后通过计数等待所有通话完成。

我认为您的数据位于response.KEY1和response.KEY2。

myApp.factory('Factory1', function($q, $rootScope) {
  var tempFactory = {};

  tempFactory.function1 = function() {
    var deferred = $q.defer();

    (GAPI AJAX CALL)
    .execute(function(response) {
      $rootScope.$apply(function () {
        deferred.resolve(response.KEY1);
      });
    });

    return deferred.promise;
  };

  return tempFactory;
});

myApp.factory('Factory2', function($q, $rootScope) {
  var tempFactory = {};

  tempFactory.function2 = function(res) {
    var deferred = $q.defer();
    var result = [];
    var count = 0;

    angular.forEach(res, function (r, i) {
      (GAPI AJAX CALL) // r as an argument
      .execute(function (response) {
        result[i] = response.KEY2;

        count++;
        if (count === res.length) {
          $rootScope.$apply(function() {
            deferred.resolve(result);
          });
        }
      });
    });

    return deferred.promise;
  };

  return tempFactory;
});

希望这有帮助。

什么应该是我的angularjs嵌套ajax调用的方法[循环中的循环]？

1 个答案: