在AngularJS中显示AJAX加载条

use*_*880 5 javascript ajax jquery angularjs

我有一个关于在执行I/O时显示/隐藏ajax加载动画的最佳实践问题.目前,我正在使用以下代码处理动画:

JS

app.controller('MyController', function($scope, Resource) {
    $scope.loading = true;
    Resource.query(function(response) {
        $scope.loading = false;
        $scope.items = response;
    });
});
Run Code Online (Sandbox Code Playgroud)

HTML

<ul ng-controller="MyController">
    <div ng-if="loading">
        <img src="/assets/ajax-loader.gif">
    </div>
    <li ng-repeat="item in items">{{ item }}</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

这是处理ajax加载器显示/隐藏的最佳方法吗?我看到一些可扩展性问题,因为我开始添加多个模块,并且必须loading为每个模块存储单独的值.

cal*_*oyd 3

以下是一些解决方案:

https://github.com/chieffancypants/angular-loading-bar

https://github.com/zhoutuoy/ngRainbow

其中一些操作服务中的 CSS。但代码中有详细说明原因。我希望这有帮助。