AngularJS:将微调器插入$ httpProvider

时间:2015-05-10 20:57:53

标签: javascript angularjs

我在ng-app的基本模板中定义了一个微调器。我有以下代码在路上有活动的AJAX请求时自动显示/隐藏它:

app.config(function ($httpProvider) {
    // Request interceptor(s)
    $httpProvider.defaults.transformRequest.push(function (data, headersGetter) {
        window.httpStart();
        return data;
    });

    // Response interceptor(s)
    $httpProvider.responseInterceptors.push('spinnerInterceptor');
})

app.factory('spinnerInterceptor', function ($q, $window) {
    return function (promise) {
        // Hide spinner on success.
        return promise.then(function (response) {
            window.httpEnd();
            return response;
        },

        // Hide spinner on failure.
        function (response) {
            window.httpEnd();
            return $q.reject(response);
        });
    };
});

app.config(function () {
    setInterval(function () {
        if (typeof (window.httpQueue) != 'undefined') {
            if (window.httpQueue > 0) {
                angular.element('#ng-loading').show();
            } else {
                angular.element('#ng-loading').hide();
            }
        }
    }, 50);

    /**
     * Mark the start of a new HTTP request.
     */
    window.httpStart = function httpStart() {
        if (typeof (window.httpQueue) == 'undefined') {
            window.httpQueue = 0;
        };

        window.httpQueue++;
    };

    /**
     * Mark the end of a HTTP request.
     */
    window.httpEnd = function httpEnd() {
        if (typeof (window.httpQueue) != 'undefined') {
            window.httpQueue--;
        };
    };
});

我讨厌在这里使用setInterval,特别是因为我们的(公司)用户群将在IE8上使用它。

我的担忧是否没有根据?如果没有,我该如何改进这段代码。

0 个答案:

没有答案