angular ajax loading

知识点：
AngularJS 中利用 Interceptors 来统一处理 HTTP 的错误

具体实现:
/**

• 拦截器 全局$http注入loading效果
  */

define(['jquery','angular'],function($,angular){

angular.module('ajaxLoading',[])

.config(function($httpProvider) {
  $httpProvider.interceptors.push('loadingInterceptor');
})
 
.directive('loading',function() {
  return {
    replace: true,restrict: 'AE',template:'<div class="back-layer"><div class="loading">'
            +'<img src="images/729.GIF">'
            +'</div></div>',link: function($scope,$element,attrs) {
        var top = $(window).height()/2 - 25;
        var left = $(window).width()/2 - 25;
        $('.loading').css({
          top: top,left: left
        });
        //$(tpl).appendTo('body');
    }
  };
})
 
.factory('loadingInterceptor',function($q,$rootScope) {

  return {
    request: function(config) {
      $(".back-layer").show();
      return config || $q.when(config);
    },response: function(response) {
      $(".back-layer").hide();
      return response || $q.when(response);
    },responseError: function(rejection) {
      $(".back-layer").hide();
      return $q.reject(rejection);
    }
  };
});

})

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!