编辑:如果确实无法在Angular UI模态框中执行此操作,“这不能在Angular UI模态框中完成”是一个有效的回答。
以下是我从触摸事件返回的数据。明显缺少任何有用的触摸X/Y坐标(https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/changedTouches)。这是一个非常普遍的问题,但还是有想法吗?传递给在触摸上执行的函数的“event”对象:
{
"originalEvent": {
"isTrusted": true
},
"type": "touchstart",
"timeStamp": 1450388006795,
"jQuery203026962137850932777": true,
"which": 0,
"view": "$WINDOW",
"target": {},
"shiftKey": false,
"metaKey": false,
"eventPhase": 3,
"currentTarget": {},
"ctrlKey": false,
"cancelable": true,
"bubbles": true,
"altKey": false,
"delegateTarget": {},
"handleObj": {
"type": "touchstart",
"origType": "touchstart",
"data": null,
"guid": 2026,
"namespace": ""
},
"data": null
}
现在,这是在Angular UI模态框中的画布中,但鼠标事件正常工作。顺便说一下,这是我的元素:
link: function(scope, element, attrs, model){
//scope.canvasElem = element[0].children[0].children[0];
scope.canvasElem = angular.element($('.touchScreen'))[0];
scope.ctx = scope.canvasElem.getContext('2d');
以下是我如何绑定的示例:
element.bind('touchstart', scope.touchStart);
编辑,这里有一个mousedown事件对象供比较:
{
"originalEvent": {
"isTrusted": true
},
"type": "mousedown",
"timeStamp": 1450389131400,
"jQuery20309114612976554781": true,
"toElement": {},
"screenY": 436,
"screenX": 726,
"pageY": 375,
"pageX": 726,
"offsetY": 81,
"offsetX": 41,
"clientY": 375,
"clientX": 726,
"buttons": 1,
"button": 0,
"which": 1,
"view": "$WINDOW",
"target": {},
"shiftKey": false,
"relatedTarget": null,
"metaKey": false,
"eventPhase": 3,
"currentTarget": {},
"ctrlKey": false,
"cancelable": true,
"bubbles": true,
"altKey": false,
"delegateTarget": {},
"handleObj": {
"type": "mousedown",
"origType": "mousedown",
"data": null,
"guid": 2025,
"namespace": ""
},
"data": null
}