angularjs - 添加加载条 Ionic App - Angular

Question

如何在 2 条路线之间添加 loading or please waiting 。

例如，当我转到像 details.html 这样的页面时，这个 pas 有 http 直到页面加载用户看到一个空白页面。

我想要这样的东西:

工厂

 .factory('DrupalNode', function ($http, $stateParams, REMOTE_URL) {

        return {
            node: $http.get(REMOTE_URL + 'all/')

//////////////// please wait

        }
    });  

Controller

app.controller('detailController', function($scope, DrupalNode, $state, $window){

    DrupalNode.node.success(function(data){  

/////////disappear waiting text 


        $scope.innerData = data;
        $scope.whichArticle = $state.params.Nid;
        console.log(data);


    });
    $scope.goBack = function() {
        $window.history.back();
    };

});

Answer 1

使用$ionicLoading ionic 服务。在 Controller 启动时调用它的 show() 函数，当您从 api 获得响应时调用它的 hide()。

  app.controller('detailController', function($scope, DrupalNode, $state, $window, $ionicLoading){
            $ionicLoading.show({
              template: 'Loading text goes here...'
            });
            DrupalNode.node.success(function(data){  
            $ionicLoading.hide();
        /////////disappear waiting text 


                $scope.innerData = data;
                $scope.whichArticle = $state.params.Nid;
                console.log(data);


            });
            $scope.goBack = function() {
                $window.history.back();
            };

        });

如果你想在加载时显示一些文本，那么使用 show() 就像这样

    $ionicLoading.show({
      template: 'Loading text goes here...'
    });