0

我有很多页面，$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

例如。

谢谢你。

4

1 回答 1

3

如果在进行 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，寻找拦截器

于 2013-09-30T07:50:10.657 回答