$ionicLoading in rootScope causing memory leaks?

1

Hi all,

I recently moved my ionicLoading function into my rootScope so that I can share it among all of my controllers (primarily to allow one controller to show the loading and for another to hide it). I’ve noticed immediately that my app now crashes pretty regularly on high-memory tasks (where it didn’t crash before).

Is it possible that putting the loading code int he rootscope is causing memory leaks?

Here is the code I’m using:

 $scope.showLoading = function(noBackdrop, text) {
    var tpl = '<i class="icon ion-loading-c"></i>';
    if (text) {
        tpl = tpl + '<br/>' + text;
    }
    $ionicLoading.show({
        template: tpl,
        noBackdrop: noBackdrop
    });
  }
  $scope.hideLoading = function() {
    $ionicLoading.hide();
  }

Thanks.

2

I did isolate the source of my crashes, and it was not the change in the ionicLoading…

I had this in a carousel, and it was killing memory:

<div on-hold="openPhotoModal($index, selectedPhoto)" class="fullViewDiv rotate{{selectedPhoto.myOrientation}}" style="width: {{selectedPhoto.myDivWidth}}; height: {{selectedPhoto.myDivHeight}}; left: {{selectedPhoto.myDivOffset}};" >
                    <img ng-src="{{selectedPhoto.path}}" class="galleryImgFull galleryImgFull{{selectedPhoto.myOrientation}}" style="width: {{selectedPhoto.myWidth}}; height: {{selectedPhoto.myHeight}};" index="$index" update-fn="hideLoading()" imageonload="selectedPhoto"/>
 </div>

Calling the following directive:

app.directive('imageonload', function() {
    return {
        restrict: 'A',
        scope: {
          updateFn: '&',
          item: '=imageonload'
        },
        link: function(scope, element, attrs, $index) {
            element.bind('load', function($index) {
                console.log(scope, scope.index, scope.item);
                if (scope.item.current) {
                  console.log('current image loaded');
                  console.log(scope.updateFn);                  
                  scope.updateFn();
                }
                // console.log(index, currentSlide);
            });
        }
    };
});

Somehow my hacky directive is chewing up memory like crazy. I’m passing the image objects (file urls, metadata) to the directive so that it can determine if the currently viewed slide (boolean in the image object’s “current” property) has been loaded. It works… but it crashes my app. Any thoughts welcome.