Thursday, March 30, 2017

Inject $rootScope into Angular 2

If you have AngularJS and Angular running side by side in the same application by using Upgrade module, then you may need access $rootScope in Angular 2 part of the application.

The upgrade module already defined a provider for $rootScope, hence you directly inject $rootScope as below

@Inject("$rootScope") private $rootScope: ng.IRootScopeService

Here is the constructor DI code:

constructor(@Inject("$rootScope") private $rootScope: ng.IRootScopeService, @Inject("$state") private $state: ng.ui.IStateService) {
        // UI-Router change events


To inject $state and other AngularJS services please refer to my other blog


  1. I notify your post really I am impressed from this post. I was searching for some info to this website , You write very well which is awesome. I enjoyed every bit of your article post. Thanks.

  2. How do you inject $rootScope into a unit test for a component that uses it?

    > No provider for $rootScope!