angularjs学習:イベント

1526 ワード

Angularイベントシステムはブラウザのイベントシステムに接続されていません.これは、DOMイベントではなく役割ドメイン上でAngularイベントを傍受するしかないことを意味します.
Angularイベント伝播:ネストされたcontroller役割ドメインチェーン上では、下方向伝播($broadcast)と上方向伝播($emit)が可能です.
<div ng-controller="ParentCtrl"> //  
 <div ng-controller="SelfCtrl"> //    
  <a ng-click="click()">click me</a>  
   <div ng-controller="ChildCtrl"></div> //    
 </div>  

 <div ng-controller="BroCtrl"></div> //    
</div>  

.controller('SelfCtrl', function($scope) {  
$scope.click = function () {  
$scope.$broadcast('to-child', 'child');  
$scope.$emit('to-parent', 'parent');  
}  
});  
.controller('ParentCtrl', function($scope) {  
$scope.$on('to-parent', function(d,data) {  
console.log(data); //        
});  
$scope.$on('to-child', function(d,data) {  
console.log(data); //        
});  
});  
.controller('ChildCtrl', function($scope){  
$scope.$on('to-child', function(d,data) {  
console.log(data); //        
});  
$scope.$on('to-parent', function(d,data) {  
console.log(data); //        
});  
});  
.controller('BroCtrl', function($scope){  
$scope.$on('to-parent', function(d,data) {  
console.log(data); //        
});  
$scope.$on('to-child', function(d,data) {  
console.log(data); //        
});  
});

$broadcastで与えられた値は、サブレベルでしか値を得ることができません.$Emitが与えた値は、親のみが得ることができます.平級は何も得られない.