Question

使用以下代码，我的加载指示器似乎有效。但是，如果有人在浏览器中重新加载页面，则加载指示器不会消失。这不会发生在索引或根目录上。使用console.log()我可以看到＆＃39; loading-complete＆＃39;已经播出，但该指令没有得到更新。有什么想法吗？

我在angularjs配置中使用以下代码：

$httpProvider.interceptors.push(function($q, $rootScope) {
    return {
        'request': function(config) {
            $rootScope.$broadcast('loading-started');
            return config || $q.when(config);
        },
        'response': function(response) {
            $rootScope.$broadcast('loading-complete');
            return response || $q.when(response);
        }
    };
});

结合以下指令：

.directive("loadingIndicator", function() {
    return {
        restrict : "A",
        template: "<div>Loading...</div>",
        link : function(scope, element, attrs) {
            scope.$on("loading-started", function(e) {
                element.css({"display" : "block"});
            });

            scope.$on("loading-complete", function(e) {
                element.css({"display" : "none"});
            });
        }
    };
})

最后，HTML：

<div class="loading" loading-indicator></div>

Answer 1

当Http请求失败时，不会调用拦截器的响应函数。尝试添加'responseError'处理程序，它也会广播事件。

'responseError': function(rejection) {
    $rootScope.$broadcast('loading-complete');
    if (canRecover(rejection)) {
      return responseOrNewPromise
    }
    return $q.reject(rejection);
  }

重新加载页面时，angularjs加载指示器不会清除

1 个答案: