Angularjs $ionicLoading未在控制器加载第一个方法上显示

我通过调用angular中的

init（）

方法从服务器加载数据用于加载程序，但在加载时间未显示。 我能够成功地从服务器获取数据，但加载程序未显示

我尝试了

angular.element（document）.ready（function（）{}）
但我仍然看不到加载器。
我需要一些关于页面加载本身的数据

示例代码：

angular.module('App.controllers').controller('WorkoutCtrl', function ($scope,$state,$ionicModal,serviceEngine,$ionicPopup,$rootScope,$ionicLoading,$location) {

    var init = function(){ 
        $ionicLoading.show({template: 'Loading...</p>'}); 
        if(deviceApi.checkConnectionStatus() === 'online'){
            console.log('We are inside online');
                 serviceEngine.getMethod()//server call
                    .success(function(data,status,headers){
                        $ionicLoading.hide(); 
                    })
                    .error(function(){
                        $ionicLoading.hide(); 
                    }) 
        }else{
            $ionicLoading.hide();
            $ionicPopup.alert({title: 'ERROR',template: 'Application is offline. Check your network connection.'});   
        } 

    }

    init();

angular.module（'App.controllers'）.controller（'WorkoutCtrl'，function（$scope、$state、$IonicModel、serviceEngine、$ionicPopup、$rootScope、$ionicLoading、$location）{
var init=function（）{
$ionicLoading.show（{模板：'Loading…
'}）；
如果（deviceApi.checkConnectionStatus（）==='online'）{
log（'我们在线'）；
serviceEngine.getMethod（）//服务器调用
.成功（功能（数据、状态、标题）{
$ionicLoading.hide（）；
})
.错误（函数（）{
$ionicLoading.hide（）；
}) 
}否则{
$ionicLoading.hide（）；
$ionicPopup.alert（{title:'ERROR'，template:'Application is offline.Check your network connection.'}）；
} 
}
init（）；
在init函数外部写入ionicLoading.show

示例：

angular.module('App.controllers').controller('WorkoutCtrl', function ($scope,$state,$ionicModal,serviceEngine,$ionicPopup,$rootScope,$ionicLoading,$location) {



  $ionicLoading.show({
            template: '<div class="icon ion-loading-a"></div> Loading... ',
            animation: 'fade-in',
            showBackdrop: true,
            maxWidth: 500,
            showDelay: 100
        });


    var init = function(){ 

        if(deviceApi.checkConnectionStatus() === 'online'){
            console.log('We are inside online');
                 serviceEngine.getMethod()//server call
                    .success(function(data,status,headers){
                        $ionicLoading.hide(); 
                    })
                    .error(function(){
                        $ionicLoading.hide(); 
                    }) 
        }else{
            $ionicLoading.hide();
            $ionicPopup.alert({title: 'ERROR',template: 'Application is offline. Check your network connection.'});   
        } 

    }

    init();

angular.module（'App.controllers'）.controller（'WorkoutCtrl'，function（$scope、$state、$IonicModel、serviceEngine、$ionicPopup、$rootScope、$ionicLoading、$location）{
$ionicLoading.show({
模板：“正在加载…”，
动画：“淡入”，
真的,，
最大宽度：500，
放映延迟：100
});
var init=function（）{
如果（deviceApi.checkConnectionStatus（）==='online'）{
log（'我们在线'）；
serviceEngine.getMethod（）//服务器调用
.成功（功能（数据、状态、标题）{
$ionicLoading.hide（）；
})
.错误（函数（）{
$ionicLoading.hide（）；
}) 
}否则{
$ionicLoading.hide（）；
$ionicPopup.alert（{title:'ERROR'，template:'Application is offline.Check your network connection.'}）；
} 
}
init（）；
尝试以下操作，这应该对您有用：

angular.module('App.controllers').controller('WorkoutCtrl', WorkoutCtrl);
 WorkoutCtrl.$inject = ['$scope', '$state', '$ionicModal', 'serviceEngine', '$ionicPopup', '$rootScope', '$ionicLoading', '$location'];

 function WorkoutCtrl ($scope, $state, $ionicModal, serviceEngine, $ionicPopup, $rootScope, $ionicLoading, $location) {
    var init = function () {
        $ionicLoading.show({
        content: 'Loading...',
        animation: 'fade-out',
        showBackdrop: false,
        maxWidth: 200,
        showDelay: 500,
      });
      if(deviceApi.checkConnectionStatus() === 'online'){
            console.log('We are inside online');
                 serviceEngine.getMethod()
                 .then(function (data,status,headers) { // DO SOMETHING WITH DATA

                  })
                  .catch(function () { // Error Handling

                  })
                  .finally(function () { // Finally close the Loader
                    $ionicLoading.hide();
                  });
        }else{
            $ionicLoading.hide();
            $ionicPopup.alert({title: 'ERROR',template: 'Application is offline. Check your network connection.'});   
      }
    }


    init();
}

我已经将隐藏加载程序的代码移动到了finally，但是，您可以在then或catch中执行。我更喜欢这样组织我的服务调用，然后：对服务调用中的数据执行一些操作，catch：处理错误，最后：执行清理工作。
我也有类似的问题（$ionicLoading.hide（）当我在我的应用程序中实现localStorage缓存时，我已经调试了很多console.logs，因为我在控制台上没有一个错误。我得出的结论是检索缓存数据非常快，$ionicLoading.hide（）在$ionicLoading.show（）之前完成执行

我解决的问题是：$timeout（function（）{$ionicLoading.hide（）}，100）；
我以前在Tianium和Android上见过这种黑客行为，所以我想这与Android代码的处理方式有关

编辑

如果您先执行$ionicLoading.show（{delay:100}），然后执行$ionicLoading.hide（），我的意思是，如果这两个调用执行得非常快（小于100ms），则永远不会显示加载，这应该是预期的结果。
我认为show调用已注册，而hide调用取消了它。显然！但是当您不使用delay选项时，show调用在执行hide调用时会花费一些时间（我猜是异步的），而hide调用会被执行（并且不隐藏任何内容）结果加载将永远保持打开状态。
请给出一些代码段，您可以尝试调用
$ionicLoading.show（）
在AngularJS的
运行
块中。它在单击事件上工作，但在任何页面加载事件上都不工作。可能是因为它将隐藏在其他地方…请一次一次检查您的工作流程。您是否获得控制台。登录控制台？是否有javascript错误？@VishalSingh-您的代码的某些部分可能有问题，我刚刚创建的用你的部分代码编写了一个代码笔，看起来效果很好：看一看