Serviço de carregador Cordova / Ionic / AngularJs

A documentação do Ionic Framework não é muito clara sobre a sobreposição de carregamento. Assim, para acionar facilmente o carregador em todos os seus controladores, como neste exemplo:

.controller(IndexCtrl', function($scope, LoaderService) {

        // Show loader from service
    LoaderService.show();

        // add action here...

       // Hide overlay when done
       LoaderService.hide();
}

você só precisa criar um serviço como este (em /js/service.js por exemplo):

angular.module('starter.services')
.factory('LoaderService', function($rootScope, $ionicLoading) {

  // Trigger the loading indicator
  return {
        show : function() { //code from the ionic framework doc

            // Show the loading overlay and text
            $rootScope.loading = $ionicLoading.show({

              // The text to display in the loading indicator
              content: 'Loading',

              // The animation to use
              animation: 'fade-in',

              // Will a dark overlay or backdrop cover the entire view
              showBackdrop: true,

              // The maximum width of the loading indicator
              // Text will be wrapped if longer than maxWidth
              maxWidth: 200,

              // The delay in showing the indicator
              showDelay: 500
            });
        },
        hide : function(){
            $rootScope.loading.hide();
        }
    }
});

Use $ rootScope aqui em vez de $ scope;)

Isso é tudo.

Estrutura Ionic: http://ionicframework.com/