dynamic provider options through app config AngularJS

Question

I have provider modules that accept configurations like:

angular.module('app', ['search']).
  config(['$searchProvider', function($searchProvider) {
    $searchProvider.options({
      resultLimit:50,
      defaultSort:'highToLow'
    });
  }]);

There will be a new app instantiation per client --- so I am thinking about using a client self serve portal to configure meta object.

This means the provider modules now need to sit inside a callback method to wait for meta before they can set their respective configurations.

But let's all remember: Configuration blocks - get executed during the provider registrations and configuration phase. Only providers and constants can be injected into configuration blocks. This is to prevent accidental instantiation of services before they have been fully configured...

...So the docs say you can use provider in configuration blocks, but I'm not sure you can use them to make service calls. Because I have no idea how to handle this the right way, I will show you my "high level" idea:

Wrap dependant providers with another provider callback:

angular.module('app', ['search','meta']).
  config(['$searchProvider','$metaProvider', function($searchProvider, $metaProvider) {
    $metaProvider.get(function(meta){
      $searchProvider.options(meta);
    });
  }]);

What's the best way to handle this?

Answer 1

I had the same problem recently. I couldn't find a solution to work within the bounds of the framework so I worked around the problem by manually bootstrapping angular after I have loaded all of the client configuration information. http://docs.angularjs.org/api/angular.bootstrap

$.get('/api/context', function () {
    // ...
    angular.bootstrap($('#container'), ['app']);
});