[SOLVED] Broadcasting a function from another controller does not work, but only in production

Broadcasting a function from another controller does not work, but only in production

This is probably the weirdest problem I have had so far with AngularJS. Our website is constructed of different routes. Each route has its view and controller, and there is also a parent controller called MainCtrl. In my index.html I import all the controllers I have. At some point I am re-routing to another child route (let's call it /iframe with IframeCtrl as the controller) and then, when I try to dispatch an event name from MainCtrl downwards to all children (the broadcasted function is in IframeCtrl), nothing happens (locally it's fine, the problem is only in production). I am not sure if the problem is that that after I change the route the function from IframeCtrl hasn't been loaded yet, but I do load it in index.html so I thought this is enough, and as I said, it does work locally.

This is the code from MainCtrl:

globalVariables.broadcastAnimateBar({stage : data.progress});

This is the code from my factory in app.'s

globalVariablesService.broadcastAnimateBar = function(stage)
{
    $rootScope.$broadcast('animateBar',stage);
}

And this is the code in IframeCtrl

$scope.$on('animateBar', function(event,args){
.
.
.
})

Any ideas how to go about it?

Thank you, Mila

Solution

I managed to get it to work by adding a timeout to the broadcast

  $timeout(function(){
       $rootScope.$broadcast('animateBar',stage);
  }, 1000);