星期六, 6月 21, 2014

[AngularJS] 事件處理機制 $broadcast , $emit , $on 的運作

筆記一下Angularjs的事件處理機制的運作方法:

First of all, parent-child scope relation does matter. You have two possibilities to emit some event:
  • $broadcast -- dispatches the event downwards to all child scopes,
  • $emit -- dispatches the event upwards through the scope hierarchy.
I don't know anything about your controllers (scopes) relation, but there are several options:
  1. If scope of firstCtrl is parent of the secondCtrl scope, your code should work by replacing $emit by $broadcast in firstCtrl:
    function firstCtrl($scope){
        $scope.$broadcast('someEvent', [1,2,3]);
    }
    
    function secondCtrl($scope){
        $scope.$on('someEvent', function(event, mass) {console.log(mass)});
    }
  2. In case there is no parent-child relation between your scopes you can inject $rootScope into the controller and broadcast the event to all child scopes (i.e. also secondCtrl).
    function firstCtrl($rootScope){
        $rootScope.$broadcast('someEvent', [1,2,3]);
    }
  3. Finally, when you need to dispatch the event from child controller to scopes upwards you can use $scope.$emit. If scope of firstCtrl is parent of the secondCtrl scope:
    function firstCtrl($scope){
        $scope.$on('someEvent', function(event, data) { console.log(data); });
    }
    
    function secondCtrl($scope){
        $scope.$emit('someEvent', [1,2,3]);
    }

沒有留言:

張貼留言

留個話吧:)

其他你感興趣的文章

Related Posts with Thumbnails