Loading Icon anytime it is needed

My app is pretty content-heavy, consequently, there is always a lag between the time the user touch the screen and between content updates (5 sec +).

I have tried to implement a loading module, and call it throughout the app by setting a ng-controller in the body tag . However there is alwasy a delay, it does not appear immediate on touch, and it does not happen everywhere i would like to (browsing via several screen etc) . Anyone would have an idea of how to make it “standard” throughout the app so that it shows up anytime app is loading something ?


.controller('loadingCtrl', function($scope, $timeout, $ionicLoading) {
  // Setup the loader
content: 'Loading',
animation: 'fade-in',
showBackdrop: true,
maxWidth: 200,
showDelay: 0
  // Set a timeout to clear loader, however you would actually call the $ionicLoading.hide(); method    whenever everything is ready or loaded.
 $timeout(function () {
  }, 2000);


 <body ng-app="wmapp" ng-controller="loadingCtrl">
<ion-nav-view ></ion-nav-view>