我有两个我正在制作的Checkbox指令: fancyCheckBox和checkAllCheckbox 。 我正在尝试向支票全部添加一个事件广播,这样花哨的复选框(会有很多)会听到事件并检查它们是否符合条件。
这是我的fancyCheckBox:
myDir.directive('fancyCheckBox', function() { return { restrict: 'A', scope: { isDomain: '=isDomain', domain: '=domainId', url: '=urlId', reason: '@reason', clickCb: '&clickCb', startChecked: '=isChecked' }, template: '<input type="checkbox" data-ng-click="toggleMe()" data-ng-model="isChecked" />', link: function(scope, elem, attrs) { scope.isChecked = angular.copy(scope.startChecked); scope.toggleMe = function() { scope.isChecked = (!scope.isChecked); scope.$eval(scope.clickCb(scope)); } scope.$on('checkAllEvent', function() { // Error on this line console.log('Herd a check all event'); }); } } });行scope.on('checkAllEvent'产生此错误:
TypeError:Object#没有方法'on'“
这是我的全部复选框:
myDir.directive('checkAllCheckbox', function() { return { restrict: 'A', scope: { reason: '@reason', clickCb: '&clickCb', startChecked: '=isChecked' }, template: '<input type="checkbox" data-ng-click="checkAll()" data-ng-model="isChecked" />', link: function(scope, elem, attrs) { scope.isChecked = (scope.startChecked) ? angular.copy(scope.startChecked) : false; scope.checkAll = function() { scope.isChecked = (!scope.isChecked); scope.$eval(function() { scope.$eval(function() { scope.$broadcast('checkAllEvent'); scope.clickCb(scope) }); }); } } } } });知道为什么我似乎无法在我的指令中广播或订阅事件吗?
编辑。 我将scope.on和scope.broadcast更改为scope.$on和scope.$broadcast 。 这停止了错误,但我的fancyCheckBox仍未收到该事件。 有任何想法吗? 我想这是因为它不在合适的范围内,但我不知道如何在那里得到它。
I have two Checkbox directives that I'm making: fancyCheckBox and, checkAllCheckbox. I'm trying to add an event broadcast to the check all so that the fancy checkboxes (there will be many) will hear the event and check themselves if they match the criteria.
Here's my fancyCheckBox:
myDir.directive('fancyCheckBox', function() { return { restrict: 'A', scope: { isDomain: '=isDomain', domain: '=domainId', url: '=urlId', reason: '@reason', clickCb: '&clickCb', startChecked: '=isChecked' }, template: '<input type="checkbox" data-ng-click="toggleMe()" data-ng-model="isChecked" />', link: function(scope, elem, attrs) { scope.isChecked = angular.copy(scope.startChecked); scope.toggleMe = function() { scope.isChecked = (!scope.isChecked); scope.$eval(scope.clickCb(scope)); } scope.$on('checkAllEvent', function() { // Error on this line console.log('Herd a check all event'); }); } } });The line scope.on('checkAllEvent' is producing this error:
TypeError: Object # has no method 'on'"
And here's my check all checkbox:
myDir.directive('checkAllCheckbox', function() { return { restrict: 'A', scope: { reason: '@reason', clickCb: '&clickCb', startChecked: '=isChecked' }, template: '<input type="checkbox" data-ng-click="checkAll()" data-ng-model="isChecked" />', link: function(scope, elem, attrs) { scope.isChecked = (scope.startChecked) ? angular.copy(scope.startChecked) : false; scope.checkAll = function() { scope.isChecked = (!scope.isChecked); scope.$eval(function() { scope.$eval(function() { scope.$broadcast('checkAllEvent'); scope.clickCb(scope) }); }); } } } } });Any idea why I can't seem to broadcast or subscribe to events in my directive?
EDIT. I changed scope.on and scope.broadcast to scope.$on and scope.$broadcast. This stopped the error but my fancyCheckBox is still not receiving the event. Any ideas? I imagine it's because it isn't in the right scope but I don't know how to get it there.
最满意答案
你可以尝试使用$ rootScope吗?
$scope.$eval(function() { $rootScope.$broadcast('checkAllEvent'); scope.clickCb(scope) });编辑:
您可能需要将$ rootScope注入到您的指令中
myDir.directive('checkAllCheckbox', function($rootScope) {...You could try using $rootScope?
$scope.$eval(function() { $rootScope.$broadcast('checkAllEvent'); scope.clickCb(scope) });EDIT:
You may need to inject $rootScope into your directive
myDir.directive('checkAllCheckbox', function($rootScope) {...更多推荐
发布评论