Can i create global ionic loader?


#1

Hi @mhartington

How to display the loader between two transition view ?
Can you help me?


#2
  $scope.$on('$stateChangeStart', 
             function(event, toState, toParams, fromState, fromParams){ 
    $ionicLoading.show();
  });


  $scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams) {
    $timeout(function(){
      $ionicLoading.hide()
    },2000);
  });

#3

The response given by @mhartington is good, but let me ask you why do you want to put a loader between transitions? I think that this effect may cause a false sensation of slowness to your app.

Maybe you want to consider a loading only when the app is fetching data from the server.


#4

Right, this is a simplified use case that will fire on every state change. You could follow this tutorial to create a loader during an $http request.

app.config(function($httpProvider) {
  $httpProvider.interceptors.push(function($rootScope) {
    return {
      request: function(config) {
        $rootScope.$broadcast('loading:show')
        return config
      },
      response: function(response) {
        $rootScope.$broadcast('loading:hide')
        return response
      }
    }
  })
})

http://learn.ionicframework.com/formulas/loading-screen-with-interceptors/


#5

Thanks… :slight_smile: It is working…

I am using push notification.OnTap on notification on notification bar. In That case $ionicPlatform.ready is executing two time… :frowning: How can i resolve?