title: Angular2 - asynchronous dependency injection
body: <p>I use Angular2 v2.2.3</p>
  
  <p>I've created common module with forRoot() function, like this:</p>
  
  <pre><code>    ...
      public static forRoot(): ModuleWithProviders {
      return {
          ngModule: CommonsModule,
          providers: [
              SomeOtherDependency,
              {
                  provide: ConfigService,
                  useFactory: ConfigFactory,
                  deps: [Http]
              }                
          ]
      };
  </code></pre>
  
  <p>Here is my ConfigFactory:</p>
  
  <pre><code>export function ConfigFactory(http:Http):Promise&lt;ConfigService&gt; {    
      return http.get('confg/config.json').map(r =&gt; {
          return new ConfigService(r);
      }).toPromise();
  }
  </code></pre>
  
  <p>I've tried to return Promise and Observable as well.</p>
  
  <p>SomeOtherDependency defined in providers requires ConfigService. The problem is that Angular does not inject value resolved by promise but promise itself.</p>
  
  <p>How can I force angular to wait until promise is resolved with proper dependency and only then inject it to other dependencies?</p>
  
  <p>I've tried different approaches and always injected value is promise or observable. Just like the iniector ignores what type factory returned. I need to load some json files before whole application starts</p>