$ON和$广播(角)

Question

$ON和$广播(角)

我有一个不同观点的页脚控制器和码扫描控制器。

angular.module('myApp').controller('footerController', ["$scope", function($scope) {}]);angular.module('myApp').
controller('codeScannerController', ["$scope", function($scope) {console.log("start");$scope.startScanner = function(){...

当我单击<li>在footer.html中，我应该在codeScanerController中获取此事件。

<li class="button" ng-click="startScanner()">3</li>

我认为这是可以实现的$on和$broadcast，但我不知道怎么做，也不知道哪里都找不到例子。

Answer 1

首先，对$on(),&nbsp;$broadcast()和$emit():.$on(name, listener)-聆听某一特定事件name.$broadcast(name, args)-通过$scope在所有儿童中.$emit(name, args)-向上发出一个事件$scope所有父级的层次结构，包括$rootScope基于以下HTML(参见这里的完整示例):<div&nbsp;ng-controller="Controller1"> &nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="broadcast()">Broadcast&nbsp;1</button> &nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="emit()">Emit&nbsp;1</button></div><div&nbsp;ng-controller="Controller2"> &nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="broadcast()">Broadcast&nbsp;2</button> &nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="emit()">Emit&nbsp;2</button> &nbsp;&nbsp;&nbsp;&nbsp;<div&nbsp;ng-controller="Controller3"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="broadcast()">Broadcast&nbsp;3</button> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="emit()">Emit&nbsp;3</button> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="broadcastRoot()">Broadcast&nbsp;Root</button> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button&nbsp;ng-click="emitRoot()">Emit&nbsp;Root</button> &nbsp;&nbsp;&nbsp;&nbsp;</div></div>激发的事件将遍历$scopes详情如下：广播1-只会被控制器1看到$scope发射1-将由控制器1看到$scope然后$rootScope广播2-将由主计长2看到$scope然后控制器3$scope发射2-将由控制器2看到$scope然后$rootScope广播3-只会被控制器3看到$scope发射3-将由控制器3看到$scope，主计长2$scope然后$rootScope广播根-将被看到$rootScope和$scope所有控制器(1，2，然后3)发出根-将仅由$rootScope触发事件的JavaScript(同样，您可以看到这里的工作示例):app.controller('Controller1',&nbsp;['$scope',&nbsp;'$rootScope',&nbsp;function($scope,&nbsp;$rootScope){ &nbsp;&nbsp;&nbsp;&nbsp;$scope.broadcastAndEmit&nbsp;=&nbsp;function(){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;This&nbsp;will&nbsp;be&nbsp;seen&nbsp;by&nbsp;Controller&nbsp;1&nbsp;$scope&nbsp;and&nbsp;all&nbsp;children&nbsp;$scopes&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$scope.$broadcast('eventX',&nbsp;{data:&nbsp;'$scope.broadcast'}); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Because&nbsp;this&nbsp;event&nbsp;is&nbsp;fired&nbsp;as&nbsp;an&nbsp;emit&nbsp;(goes&nbsp;up)&nbsp;on&nbsp;the&nbsp;$rootScope, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;only&nbsp;the&nbsp;$rootScope&nbsp;will&nbsp;see&nbsp;it &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$rootScope.$emit('eventX',&nbsp;{data:&nbsp;'$rootScope.emit'}); &nbsp;&nbsp;&nbsp;&nbsp;}; &nbsp;&nbsp;&nbsp;&nbsp;$scope.emit&nbsp;=&nbsp;function(){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Controller&nbsp;1&nbsp;$scope,&nbsp;and&nbsp;all&nbsp;parent&nbsp;$scopes&nbsp;(including&nbsp;$rootScope)&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;will&nbsp;see&nbsp;this&nbsp;event &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$scope.$emit('eventX',&nbsp;{data:&nbsp;'$scope.emit'}); &nbsp;&nbsp;&nbsp;&nbsp;}; &nbsp;&nbsp;&nbsp;&nbsp;$scope.$on('eventX',&nbsp;function(ev,&nbsp;args){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log('eventX&nbsp;found&nbsp;on&nbsp;Controller1&nbsp;$scope'); &nbsp;&nbsp;&nbsp;&nbsp;}); &nbsp;&nbsp;&nbsp;&nbsp;$rootScope.$on('eventX',&nbsp;function(ev,&nbsp;args){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log('eventX&nbsp;found&nbsp;on&nbsp;$rootScope'); &nbsp;&nbsp;&nbsp;&nbsp;});}]);