ajax - Angular JS 数据未从异步 http 请求填充

Question

我正在尝试获取一个加载 div 以显示我的 Angular 模块何时联系服务器。我使用 AngularJS 1.0.1 和 AngularJS Resources 1.0.1 来扩展 HTML 和 jquery 1.7.2 的功能，以获得一些额外的 dom 操作和 ajax 支持。

我已经发现，如果我在 async false 中运行 ajax 调用，加载 div 将不会显示，但 Firefox 除外，它会显示，但动画 gif 不是动画的。

如果我以 async true 运行 ajax 调用，则返回的数据不会加载到已加载模板部分的 Angular 模型变量中。

是否可以获取动画加载 div 来显示并获取 Angular 数据以加载到模型中？

Answer 1

希望我的理解是正确的。您想要显示 ajax 请求的加载进度。为此，您需要一个响应拦截器。以下是如何执行此操作的示例 http://jsfiddle.net/zdam/dBR2r/

// register the interceptor as a service, intercepts ALL angular ajax http calls
.factory('myHttpInterceptor', function ($q, $window, $rootScope) {
    return function (promise) {
        $rootScope.nowloading = true; // use ng-show="nowloading" on element containing spinner
        return promise.then(function (response) {
            // do something on success
            $rootScope.nowloading = false; // need to turn it off on success 
            return response;

        }, function (response) {
            // do something on error
            $rootScope.nowloading = false;  // need to turn it off on failure
            $rootScope.network_error = true;   // you might want to show an error icon.
            return $q.reject(response);
        });
    };

希望这有帮助

--丹