how do return the $state.current.name from ui-router statechange

Question

I would like to return the .state('name') when I change location in angular.

From my run() it can return the $state object:

 .run(function($rootScope, Analytics, $location, $stateParams, $state) {       console.log($state); 

but when I try to get$state.current it is empty object

.run(function($rootScope, $location, $stateParams, $state) {        console.log($state.current); 

config example:

 .config(function($stateProvider, $urlRouterProvider, AnalyticsProvider) {           $urlRouterProvider.otherwise('/');         $stateProvider         .state('home', {             url: '/',             views: {               '': {                 templateUrl: 'views/main.html',                 controller: 'MainCtrl'               },               'navigation@home': {                 templateUrl: 'views/partials/navigation.html',                 controller: 'NavigationCtrl'               },               'weekly@home': {                 templateUrl: 'views/partials/weekly.html',                 controller: 'WeeklyCtrl'               },               'sidepanel@home': {                 templateUrl: 'views/partials/side-panel.html',                 controller: 'SidePanelCtrl'               },               'shoppanel@home': {                 templateUrl: 'views/partials/shop-panel.html',                 controller: 'ShopPanelCtrl'               },               'footer@home': {                 templateUrl: 'views/partials/footer.html',                 controller: 'FooterCtrl'               }             }           }) 

Answer 1

You can listen for '$stateChangeSuccess' and set state accrodingly. For example -

$rootScope.$on('$stateChangeSuccess',   function(event, toState, toParams, fromState, fromParams) {     $state.current = toState;   } )