dependency injection - Accessing root Angular 2 injector instance globally

Question

How to access an instance of root Angular 2 injector globally (say, from browser console).

In Angular 1 it was angular.element(document).injector().

It can be useful during testing and exploration, to use browser console to get injector to then access instances of different components, directives, services etc.

Answer 1

You must set it into a service after bootstrapping the application:

export var applicationInjector: Injector;

bootstrap([AppComponent]).then((componentRef: ComponentRef) => {
  applicationInjector = componentRef.injector;
});

Then you can import it into other parts of your application:

import {applicationInjector} from './bootstrap';

See this question for more details:

• Good way to secure multiple Angular 2 components

Edit

You can inject the ApplicationRef into components and have access to the root injector through it:

@Component({
  (...)
})
export class SomeComponent {
  constructor(private app:ApplicationRef) {
    var rootInjector = app.injector;
  }
}

You need to leverage dependency injection to get it.