在请求网络的时候，显示loading画面
1. 使用http的interceptor，截断处理所有的http请求和响应，以及错误。在request的时候设置$rootScope.loading=True，在反馈的时候设置$rootScope.loading=False.
2. 设置遮罩div，ng-show=loading,即请求中显示遮罩，请求完毕不显示
细节：
interceptor
$httpProvider.interceptors.push(['$q','$rootScope',function($q,$rootScope){
return {
'request': function(config){
$rootScope.loading = true;
return $q.resolve(config);
},
'response': function(response){
$rootScope.loading = false;
return $q.resolve(response);
},
'requestError':function(rejection){
$rootScope.loading = false;
return $q.reject(rejection);
},
'responseError':function(rejection){
$rootScope.loading = false;
return $q.reject(rejection);
}
}
}]);
html
<div class="flyover" ng-show="loading">
<div class="mask"></div>
<div class="alert alert-info">
<strong>Loading Foo...</strong>
</div>
</div>
css
/** mask **/
.flyover .mask {
top:;
left:;
position: fixed;
width: 100%;
height: 100%;
opacity: 0.5;
background: black;
z-index:;
}
.flyover .alert{
left: 50%;
top: 50%;
position: fixed;
z-index:;
}
参考：http://tech.wonga.com/angular-http-loader/