title: How can I wait for services to initialise before loading controllers in AngularJs?
body: <p>I have a number of services defined within an AngularJs application. There is a root service that must load, get some data from a server, then the other services that depend on this root service can initialise, and after that the controllers can load and display data on the page. </p>
  
  <p>Th problem is controllers are loading before the root service, and child services, can fully initialise, eg:</p>
  
  <ul>
  <li>User loads page
  <ul>
  <li>root service starts initialisation</li>
  <li>controller loads, which depends on child service (which depends on root service)</li>
  <li>page binding fails because child service cannot supply data to controller</li>
  <li>root service finishes intialisation (too late)</li>
  </ul></li>
  </ul>
  
  <p>The initialisation flow I want is this:</p>
  
  <ul>
  <li>User loads page
  <ul>
  <li>root service starts initialisation</li>
  <li>root service finishes intialisation </li>
  <li>child services which depend on root service initialise </li>
  <li>controller loads, which depends on child service </li>
  <li>page binding succeeds</li>
  </ul></li>
  </ul>
  
  <p>Is there a technique for handling this kind of problem?</p>