Angular wait for promise in module.run

Question

I'm working on an angular application and I'm using a service which should load some details from the server before the execution of the application is continued.

application.run(($myService)=>{
    myService.loadSomething() //The application should pause until the execution  of the Service
                              //is completed until this the browser shoudl stay in a "loading state"
});

Is sometehing like this even possible?

Answer 1

Not in the .run - the .run function will not "block". Typically, one can use ngRoute/ui-router and use the resolve property.

If you don't want to go this route, you could create an app-level controller and "resolve" there:

.controller("AppCtrl", function($scope, loaderSvc){
   $scope.load = false;
   loaderSvc.preload().then(function(){
      $scope.load = true;
   });
});

and in the View:

<div ng-controller="AppCtrl">
  <div ng-if="::load" ng-include="'main.html'">
</div>

Answer 2

Get yourself familiar with $q and try to plan your application as it must not wait for anything to happen. Asynchronism is the key of every AngularJS app.

If you are using the router, get familiar with resolve, that may also help you "waiting" for data before a route/view will be shown.