Angular router's viewContentLoading issue did not work

Question

I have created a set of views by using ui-router.Then I write a run() function to listen a route issue like this:

$rootScope.$on('$viewContentLoading',function(evt,config){
         console.log("one is loading!");
     })

So I say I want to create a movement or some kind of animate during the view content is loading,but the code above just consoled nothing. Then I try another state called $viewContentLoaded and do the same thing,and it worked,it consoled something as expected.

But why would these two issues behave differently?

Answer 1

Are you positive you're setting up listeners on the correct scopes? $viewContentLoading is broadcast on $rootScope while $viewContentLoaded is emitted from the local $scope.

This StackOverflow question may help shed some light on why the 2 act different and may help you figure out what's wrong:

• $rootScope.$broadcast vs. $scope.$emit

Maybe you can also add a Plunkr showing the issue? I am unable to replicate this issue.