Open ionicModal on stateChangeStart

Question

I have been reviewing the different methods for authorization/authentication in the framework. What I am trying to do is assign a value to a state, then use ui-routers ability to detect the state change using $stateChangeStart. I am injecting the ionicModal service into app.js .run function and then creating the modal and attaching it to the $rootScope. When I try and open it I get the following error:

Cannot read property 'show' of undefined

Here is app.js:

angular.module('authlyApp', ['ionic', 'authlyApp.controllers', 'authlyApp.services'])

.run(function($ionicPlatform, $ionicModal, $rootScope) {
  $ionicPlatform.ready(function() {
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);

    }
    if (window.StatusBar) {
      StatusBar.styleDefault();
    }
  });

  $ionicModal.fromTemplateUrl('templates/login.html', {
    scope: $rootScope
  }).then(function(modal) {
    $rootScope.modal = modal;
  });

  $rootScope.$on('$stateChangeStart',
  function(event, next, toState, fromState, toParams, fromParams){
    console.log(next)
    if ('data' in next && 'requireAuth' in next.data) {
      event.preventDefault();
      $rootScope.modal.show();
    }
  });

})

.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider

  .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'templates/menu.html',
    controller: 'AppCtrl',
    data: {
      requireAuth: true
    }
  })

  .state('app.search', {
    url: '/search',
    views: {
      'menuContent': {
        templateUrl: 'templates/search.html'
      }
    }
  })

  .state('app.browse', {
    url: '/browse',
    views: {
      'menuContent': {
        templateUrl: 'templates/browse.html'
      }
    }
  })

  .state('app.playlists', {
    url: '/playlists',
    views: {
      'menuContent': {
        templateUrl: 'templates/playlists.html',
        controller: 'PlaylistsCtrl'
      }
    }
  })

  .state('app.single', {
    url: '/playlists/:playlistId',
    views: {
      'menuContent': {
        templateUrl: 'templates/playlist.html',
        controller: 'PlaylistCtrl'
      }
    }
  });

  $urlRouterProvider.otherwise('/app/playlists');
});