Debugging angular ui-router under ionic

Thanks to the comment from George Stocker I figured it out. The resulting code looks like this:

angular.module('starter', []).run(['$rootScope',function($rootScope){     $rootScope.$on('$stateChangeStart',function(event, toState, toParams, fromState, fromParams){          console.log('$stateChangeStart to '+toState.to+'- fired when the transition begins. toState,toParams : \n',toState, toParams);        });    $rootScope.$on('$stateChangeError',function(event, toState, toParams, fromState, fromParams, error){          console.log('$stateChangeError - fired when an error occurs during transition.');          console.log(arguments);        });    $rootScope.$on('$stateChangeSuccess',function(event, toState, toParams, fromState, fromParams){          console.log('$stateChangeSuccess to '+toState.name+'- fired once the state transition is complete.');        });    $rootScope.$on('$viewContentLoaded',function(event){          console.log('$viewContentLoaded - fired after dom rendered',event);        });    $rootScope.$on('$stateNotFound',function(event, unfoundState, fromState, fromParams){          console.log('$stateNotFound '+unfoundState.to+'  - fired when a state cannot be found by its name.');          console.log(unfoundState, fromState, fromParams);        });}])

Here you can inject the AngularJS logging service to your Ionic project, in just one run method call:

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services'])    .run(['$rootScope', '$log', '$ionicPlatform', function ($rootScope, $log, $ionicPlatform) {            $ionicPlatform.ready(function () {            // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard            // for form inputs)            if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {                cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);                cordova.plugins.Keyboard.disableScroll(true);            }            if (window.StatusBar) {                // org.apache.cordova.statusbar required                StatusBar.styleDefault();            }        });        // Debug stuff...        $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {            $log.debug('$stateChangeStart to ' + toState.name + '- fired when the transition begins. toState,toParams : \n', toState, toParams);        });        $rootScope.$on('$stateChangeError', function (event, toState, toParams, fromState, fromParams, error) {            $log.debug('$stateChangeError - fired when an error occurs during transition.');            $log.debug(arguments);        });        $rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {            $log.debug('$stateChangeSuccess to ' + toState.name + '- fired once the state transition is complete.');        });        // $rootScope.$on('$viewContentLoading',function(event, viewConfig){        //   // runs on individual scopes, so putting it in "run" doesn't work.        //   $log.debug('$viewContentLoading - view begins loading - dom not rendered',viewConfig);        // });        $rootScope.$on('$viewContentLoaded', function (event) {            $log.debug('$viewContentLoaded - fired after dom rendered', event);        });        $rootScope.$on('$stateNotFound', function (event, unfoundState, fromState, fromParams) {            $log.debug('$stateNotFound ' + unfoundState.name + '  - fired when a state cannot be found by its name.');            $log.debug(unfoundState, fromState, fromParams);        });    }])

For production you can disable debug, with this in your config block:

.config(function($logProvider){    $logProvider.debugEnabled(false);});