Javascript 在一次单击中处理多个http请求

我对angularJS是新手。我对块用户界面使用了Angular指令，它按预期工作。我的问题是两个模板之间得到加载它实际上调用3后端服务。所有这些服务都必须是顺序的。因此，在错误场景中，它只需跳过这一步。根据块UI设计，它确实显示了加载页面，但显示了3次（基本上每次http调用都会启动/停止）。我试着用它来手动启动/停止，但没有效果。即使按照他们的指示，我也肯定是在配置上做错了什么。抱歉，如果这是一个愚蠢的问题，但我对angular js是新手，学习这些全新的东西

这里是关于我正在使用的指令的更多细节

我的代码：

 angular.module(‘myApp').controller('MyController', function($scope, blockUI) {

//A function called from user interface, which performs an async operation.
 $scope.onSave = function(item) {

    // Block the user interface
     blockUI.start();

    // Perform the async operation    
     item.$save(function() {
               //service call 1 $http.post
                 if success then
                     //service call 2 $http.post
                     if success
                       //service call 3 $http.post
                     else
                       //error scenario
                 else
                    //error scenario
      // Unblock the user interface
       blockUI.stop();
    });
  };
});

---

上面的代码将显示blockUI 3次。as（3个http调用）…希望在执行blockUI时将3个不同的调用视为一个调用。

当我找到问题的答案时，我总是很高兴。这里是我用于实现的答案。希望这能帮助别人

 angular.module(‘myApp').controller('MyController', function($scope,      blockUI) {

//A function called from user interface, which performs an async      operation.
 $scope.onSave = function(item) {

// Block the user interface
 blockUI.start();

// Perform the async operation    
 item.$save(function() {

           $timeout(function() {
            blockUI.message('Still loading ...'); 

           //service call 1 $http.post
             if success then{
                   $timeout(function() { 
                   blockUI.message('Almost there ...');      

                 //service call 2 $http.post
                 if success then{
                   $timeout(function() { 
                   blockUI.message('Cleaning up ...'); 

                   //service call 3 $http.post
                   if success then
                       //process save
                   else{
                       //error scenario
                       // Unblock the user interface
                       blockUI.stop();
                   }
                    }, 3000);
                 }else{
                   //error scenario
                   // Unblock the user interface
                  blockUI.stop();
                 }
              }, 2000);
             }else{
                //error scenario
                // Unblock the user interface
                blockUI.stop();
             }
  }, 1000);

});
  };
});

这将解决我的问题…it用户blockUI作为单个blockUI进行完整的3次调用。现在，我可以拥有它或不拥有它取决于个人的选择。

看看这个线程和这个线程