angularjs - 添加加载条 Ionic App - Angular

标签 angularjs ionic-framework angular-ui-router

如何在 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();
    };

});

最佳答案

使用$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...'
    });

关于angularjs - 添加加载条 Ionic App - Angular,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32269153/

相关文章:

javascript - 内部 ng-repeat 内部 ng-repeat

javascript - Ng-repeat 在将值插入数组后不更新,尝试了 $scope.$apply() 但返回错误

javascript - HTML 表单更改焦点进入

css - $ionic 弹出窗口未显示在底部

ios - Cordova 插件 - 如何使用 build.json

angularjs - Angular ui-router 在 ui-view 中重新加载整个应用程序

angularjs - $state.go 使用动态参数重新加载和更新 URL

javascript - Angular ngIf + Bootstrap 行 : content of last div gets nested in previous div or is not rendered

javascript - 装载机中的 Ionic 2 自定义 svg 微调器

javascript - AngularJS UI Router 多次加载同一个 Controller