$stateChangeSuccess getting fired after controller is instantiated

3
votes

Route configuration:

        $stateProvider.state('root', {
            url: "/",
            template: '<div ui-view></div>'
          })
      .state('root.child',{
         url: '/child',
         templateUrl: 'some.html'
         controller: function(){
             console.log('child')
         }
      });

StateChangeStart listener:

        $scope.$on('$stateChangeStart', function (event, state, params, fromState, fromParams) {
         console.log('state change start');
            }
        });

When I navigate to state 'root.child', first 'state change start' is printed on console and then 'child' is printed. But when I refresh the page while in child state or directly hit the url '/child', first 'child' is printed and then 'state change start' is printed. Please help.

1
angularjsangular-ui-router

1 Answers

0
votes

You need to call event.preventDefault(); first.

For your interest, if you want to do something where you run $state within the $stateChangeStart, it will not work. It's a known issue.