angularjs - Need to resolve a $http request before the execution of the resolve property inside $stateProvider -

i’m building angular application going run on several domains. since there different configurations on each domain i'll need fetch variables doing call server. call return json object contains different rest urls. problem need call before 'resolve' step inside $stateprovider, since have task dependent on configuration object server.

what should work here great feature $urlrouterprovider.deferintercept(); documented here:

$urlrouterprovider

the deferintercept(defer)

disables (or enables) deferring location change interception.

if wish customize behavior of syncing url (for example, if wish defer transition maintain current url), call method @ configuration time. then, @ run time, call $urlrouter.listen() after have configured own $locationchangesuccess event handler.

the code snippet api documentation:

var app = angular.module('app', ['ui.router.router']);  app.config(function($urlrouterprovider) {    // prevent $urlrouter automatically intercepting url changes;   // allows configure custom behavior in between   // location changes , route synchronization:   $urlrouterprovider.deferintercept();  }).run(function($rootscope, $urlrouter, userservice) {    $rootscope.$on('$locationchangesuccess', function(e) {     // userservice example service managing user state     if (userservice.isloggedin()) return;      // prevent $urlrouter's default handler firing     e.preventdefault();      userservice.handlelogin().then(function() {       // once user has logged in, sync current url       // router:       $urlrouter.sync();     });   });    // configures $urlrouter's listener *after* custom listener   $urlrouter.listen(); }); 

and also, related question:

• angularjs - ui-router - how configure dynamic views

there working example - plunker

to make clear, suitable use case, let's observe code of plunker.

so, firstly can see .config() phase. have access providers not services (e.g. $http). not yet, services available later...

app.config(function ($locationprovider, $urlrouterprovider, $stateprovider)  {     // put ui-router hibernation     // waiting explicit resurrection later     // give time want... in .run() phase     $urlrouterprovider.deferintercept();     $urlrouterprovider.otherwise('/other');      $locationprovider.html5mode({enabled: false});     $stateproviderref = $stateprovider; }); 

what did, set reference provider (configurable object), used later: $stateproviderref.

and crucial thing stopped ui-router, , forced him wait $urlrouterprovider.deferintercept(); (see doc , cites above)

there extract of .run() phase:

app.run(['$q', '$rootscope','$http', '$urlrouter',   function ($q, $rootscope, $http, $urlrouter)    {     // run phase can use services (conigured in config phase)    // e.g. $http load data     $http       .get("myjson.json")       .success(function(data)       {          // here can use loaded stuff enhance our states         angular.foreach(data, function (value, key)          {            var state = { ... }           ...            $stateproviderref.state(value.name, state);         });         // configures $urlrouter's listener *after* custom listener          // here comes resurrection of ui-router         // these 2 important calls, return execution          // routing provider         // , let application use loaded stuff         $urlrouter.sync();         $urlrouter.listen();       }); }]); 

most important is, .run() executed once. once. require.

we can use technique: resolve inside of 1 super root state, parent of state hierarchy roots. check details here:

nested states or views layout leftbar in ui-router?