我正在我的应用程序中尝试ngTouch
的ng-click
指令,它似乎破坏了大多数移动设备(Android/iOS)的一些基本功能。当ng-click
作为依赖项包含时,包装在ngTouch
指令的html元素中的复选框和视频不起作用。
劫掠者是here。至于查看问题,您可以使用Google Chrome's Emulation功能来模拟问题,我建议您在plunker's embededd view上查看它。
当ngTouch
包含为对移动设备的依赖时,请考虑此标记:
<div ng-controller="AppController" ng-click="doSomethingAwesome()">
<input type="checkbox" id="chk-1">
<label for="chk-1">This checkbox and video does not work</label>
<video width="320" height="240" controls>
<source src="http://www.w3schools.com/tags/movie.mp4" type="video/mp4">
<source src="http://www.w3schools.com/tags/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</div>
你必须点击视频或复选框几次(有时更多)只是为了标记复选框或播放视频。但是,删除
ng-click
指令或删除应用程序中的ngTouch
依赖项可以解决问题,但我也希望使用ngTouch
指令和服务。如果有人能向我解释这一点,或给我指出正确的方向,我将不胜感激。
最佳答案
我通过创建另一个类似于原始ngClick
指令的指令来解决这个问题,并在父元素上使用它,而不是使用ngClick
。
UPDATED PLUNKER
指令
.directive('basicClick', function($parse, $rootScope) {
return {
compile: function(elem, attr) {
var fn = $parse(attr.basicClick);
return function(scope, elem) {
elem.on('click', function(e) {
fn(scope, {$event: e});
scope.$apply();
});
};
}
};
});