Async process from .run is not over in .controller

Hi

I have an issue with the logics in my app. I need high-level javascript advice on this.

In the .run, I asynchronously retrieve a database from a server. When it’s done I write the array imagesUrls containing information in the localStorage:

  var promiseUpdateProDB = updateProDB.get();
  promiseUpdateProDB.then(
          function(prodata) {
              var prodata = sessionService.get('prodata');
              
              var imagesUrls = imagesService.manage(prodata);
              // console.log('imagesUrls in app.js :');
              // console.log(imagesUrls);
              sessionService.persist('imagesUrls', imagesUrls);
          },
          function(error) {}); 

Then, in the .controller('AppCtrl', ...., which is the controller of my ‘side menu’, I need to use this imagesUrls written in the localStorage :

app.js:

.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider

    .state('app', {
      url: "/app",
      abstract: true,
      templateUrl: "templates/menu.html",
      controller: 'AppCtrl'
    })
...

controllers.js:

.controller('AppCtrl', ....
....
$scope.imagesUrls = sessionService.get('imagesUrls');
$scope.getImgPathProfileModal = function(str) {
    str = $filter('nospace')($filter('lowercase')(str));
    str = str + ".png";
    return $scope.imagesUrls[str];
}

but at this time, the asynchronous process is not finished, and $scope.imagesUrls is null…

Can you help me figure out a clean/best practices/robust way to do this ?

Thanks a lot for your help.

I did this eventually

I declared a deferred on the $rootscope in the .run:

        $rootScope.imagesUrlsAreStored = $q.defer();
        promiseUpdateProDB.then(
          function(prodata) {
              var prodata = storageService.get('prodata');
              imagesService.manageStoredImageUrlsNew(prodata);
              $rootScope.imagesUrlsAreStored.resolve();
          },
          function(error) {}); 

then in the controllers.js:

$q.when($rootScope.imagesUrlsAreStored.promise).then(function(){     
    $scope.imagesUrls = storageService.get('imagesUrls');
});
$scope.getImgPathProfileModal = function(str) {
    str = $filter('nospace')($filter('lowercase')(str));
    str = str + ".png";
    return $scope.imagesUrls[str];
}