数据加载时如何在AngularJS中显示等待消息？

Question

我是AngularJS的新手并试图找到在数据加载时如何显示等待消息的方法？我的意思是数据开始加载,显示消息并在数据加载完成后将其删除.

我在互联网上搜索但没找到我需要的东西......

Answer 1

<div ng-if="data.dataLoading">
    Loading...
</div>

JS

$scope.data.dataLoading = true;

return someService.getData().then(function (results) {                    
    ...
}).finally(function () {
    $scope.data.dataLoading = false;
});

Answer 2

取决于您加载数据的位置.我使用的一个解决方案是创建一个LoadingService

app.factory('LoadingService', function($rootScope) {
    return {
        loading : function(message) {
             $rootScope.loadingMessage = message;
        },
        loaded : function() {
             $rootScope.loadingMessage = null;
        }
    }
}).controller('FooController', function($scope,$http,LoadingService) {

   $scope.loadSomeData = function() {
       LoadingService.loading('Data is loading');

       $http.get('/data').finally(function() {
            LoadingService.loaded();
       });
   };
});

由于我只有一个显示消息的地方,我可以使用RootScope来处理这个问题.如果你想多次加载一条消息,你可以编写一个指令来处理这个,就像Codezilla发布的一样