我无法捕获像这样发送的事件:
document.body.dispatchEvent(event);
下面的指令是在一个div,在身体内:
.directive('myDirective',function(){ return { restrict: 'A',link: function(scope,element,attrs,pageCtrl){ element.bind('myEvent',function(){ console.log('caught my event!'); }); } }; });
如果在div上使用triggerHandler发送事件,则此方法有效.
event = new Event('myEvent'); elem.triggerHandler(event);
如何在指令内的文档主体上捕获自定义事件?
更新:
这适用于Cordova应用程序,带有现有插件,可在document.body上调度事件.那么有另一种方法可以在div的指令中捕获这些事件吗?
问题在于事件冒泡,这意味着当您从document.body发送事件时,它会通过其祖先传播.由于它不会通过它的后代传播,因此你的指令的事件监听器永远不会被触发.
原文链接:https://www.f2er.com/angularjs/240572.html但是,您可以使用Angular的内部事件系统捕获身体上的事件并触发您的div.
创建两个指令
一个用以下行为装饰body元素:
>抓住科尔多瓦事件,然后……
>从rootScope广播Angular-internal事件
.directive('bodyDirective',function($rootScope){ return { restrict: 'A',attrs){ element.bind('myEvent',function(){ $rootScope.$broadcast('cordovaEvent'); }); } }; })
…和另一个用捕获Angular事件的行为来装饰div:
.directive('divDirective',attrs) { scope.$on('cordovaEvent',function(){ // do something here }); } } })
Plunker(您必须在单独的窗口中查看预览并在那里观看控制台)