Question

我有很多页面，我使用$http处理请求（获取数据，更新），每次都必须使用ajax-loading.gif。

现在，我需要这样做：

<div ng-show="model == null || ajaxUpdating">
    <div>
        <img src="~/Content/Images/gif-load.gif" />
        <p>Waiting server respone...</p>
    </div>
</div>

此处我有ajaxUpdating标记，我在请求之前初始化并在success或error回调中设置为false：

    $scope.ajaxUpdating = true;
    $http({
        url: updateUrl,
        method: 'POST'
    }).
    success(function (data, status) {
        window.location.href = settings.redirectAfterOk;
    }).
    error(function (data, status) {
        $scope.ajaxUpdating = false;
        alert(data.errorMsg || settings.errors.update);
    });

所以，我想知道，如果现在请求处理，是否可以检查？我不想在我的代码中的每个位置使用这么多标志，如果我只是写的话，它会更容易：

$http.isProcessing

例如。

求你了。

Answer 1

如果在ajax http请求正在进行时需要加载gif，可以在配置上设置拦截器，如下所示：

var myApp = angular.module('myApp', []).config(
    [ '$routeProvider', '$locationProvider',
    function($routeProvider, $locationProvider) {
    //routes here   
 }]).config(function($httpProvider) {
//show a loading div when a http request is running
        var numLoadings = 0;
        var loadingScreen = $('<div style="position:fixed;top:0;left:0;right:0;bottom:0;z-index:10000;background-color:gray;background-color:rgba(70,70,70,0.2);"><img style="position:absolute;top:50%;left:50%;" alt="" src="css/loading.gif" /></div>').appendTo($('body')).hide();
        $httpProvider.responseInterceptors.push(function() {
            return function(promise) {
                numLoadings++;
                loadingScreen.show();
                var hide = function(r) { if (!(--numLoadings)) loadingScreen.hide(); return r; };
                return promise.then(hide, hide);
            };
        });
    });

请参阅$http，查找拦截器

有可能知道，该请求正在处理中

1 个答案: