单点击处理多个http请求

我是angularJS的新手。我使用了Angular指令来阻止UI，并且按预期工作。我的问题是两个模板之间的加载，它实际上调用3后端服务。这一切服务必须是连续的。所以在错误的情况下，它只是跳过这一步。按照块UI设计，它确实显示加载页面，但它显示3次（基本上每个http调用都启动/停止）。我尝试过使用它们的手动启动/停止功能，但效果不佳。即使遵循他们的方向，我也必须在配置上做错事。对不起，如果它的愚蠢的问题，但我是新的角js和学习这一切的新东西。单点击处理多个http请求

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

github link

我的代码：

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倍。作为（3个http调用）...想要在blockUI执行时将3个不同的调用视为一个调用。

来源

2015-11-19 PreTri

看看这个线程http://stackoverflow.com/questions/18010796/return-interdependent-async-promises-in-routeprovider-resolve和这一个http://stackoverflow.com/questions/16284403/chaining -ajax通话功能于angularjs –

当我找到我的问题的答案时，它总是让我高兴。这里是我用于实现的答案。希望这有助于他人。

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); 

}); 
    }; 
});

这将照顾我的问题......它的用户blockUI的全部3调用作为单个blockUI。现在，我可以拥有它或不是由个人选择。

来源

2015-11-23 03:05:02 PreTri

单点击处理多个http请求

回答

相关问题