Question

我想在链中进行多个Ajax调用。但我也希望在每次通话之后按下数据，然后再拨打下一个电话。最后，当所有调用成功时，我想运行其他一些代码。

我正在为我的Ajax调用使用Angular $ http服务，并希望坚持这一点。

有可能吗？

Answer 1

是的，AngularJS非常优雅地处理了这个问题，因为它的$http服务是围绕PromiseAPI构建的。基本上，对$http方法的调用会返回一个承诺，您可以使用then方法轻松链接承诺。这是一个例子：

$http.get('http://host.com/first')
   .then(function(result){
    //post-process results and return
    return myPostProcess1(result.data); 
   })
   .then(function(resultOfPostProcessing){
    return $http.get('http://host.com/second'); 
   })
   .then(function(result){
    //post-process results of the second call and return
    return myPostProcess2(result.data); 
   })
   .then(function(result){
      //do something where the last call finished
   });

您也可以将后期处理和下一个$http功能结合起来，这一切都取决于谁对结果感兴趣。

$http.get('http://host.com/first')
   .then(function(result){
    //post-process results and return promise from the next call
    myPostProcess1(result.data); 
    return $http.get('http://host.com/second'); 
   })
   .then(function(secondCallResult){
     //do something where the second (and the last) call finished
   });

Answer 2

接受的答案是好的，但它并没有解释捕获量，最后解释了真正的锦上添花的方法。这great article on promises让我直截了当。以下是基于该文章的示例代码：

$scope.spinner.start();

$http.get('/whatever/123456')
  .then(function(response) {
     $scope.object1 = response.data;
     return $http.get('/something_else/?' + $scope.object1.property1);
  })
  .then(function(response) {
     $scope.object2 = response.data;
     if ($scope.object2.property88 == "a bad value")
        throw "Oh no! Something failed!";
     return $http.get('/a_third_thing/654321');
  })
  .then(function(response) {
     $scope.object3 = response.data;
  })
  .catch(function(error) {
     // this catches errors from the $http calls as well as from the explicit throw
     console.log("An error occured: " + error);
  })
  .finally(function() {
     $scope.spinner.stop();
  });

在AngularJs中链接Ajax调用

2 个答案: