Я пытаюсь сделать базовую программу рисования с использованием модуля углового касания и его $ swipe службы вместе с холстом html5, вот что я придумал, он содержится в модуле и контроллере, который я знаю, работает
this.canvas=angular.element('canvas')[0];
console.log(this.canvas.on)
this.canvasCord=angular.element(this.canvas).offset();
var ctx=this.canvas.getContext('2d');
$swipe.bind(angular.element('canvas'),{start:this.startDraw,move:this.coninueDraw,end:this.continueDraw,cancel:function(event){console.log(event);}},["mouse","touch"]);
var convertCord=function(cord){
cord.x=cord.x-this.canvasCord.left;
cord.y=cord.y-this.canvasCord.top;
return cord;
};
this.startDraw=function(cord,event){
console.log('starting')
cord=convertCord(cord);
ctx.beginPath()
ctx.moveTo(cord.x,cord.y);
ctx.lineWidth='5';
};
this.continueDraw=function(cord,event){
console.log(cord);
cord=convertCord(cord);
ctx.lineTo(cord.x,cord.y);
ctx.stroke();
};
мой html для моего холста - это просто базовый <canvas></canvas>
моя проблема в том, что функции события, которые являются частью $swipe.bind()
, никогда не вызываются, когда элемент коснулся или щелкнул или щелкнул. единственный обратный вызов, который, как мне кажется, может работать, - это отмена, на которую я запускаю кратковременное нажатие или щелчок по холсту за короткий промежуток времени. Я использую jquery mobile, но angularjs и angularjs-touch загружают после jquery и jquery mobile. кто-нибудь знает, почему это не работает?
я узнал, что моя проблема была ссылкой на this
объект, это определяется по-разному в $swipe
преобразовывая их в обычные переменные, а затем прикрепляя их к этому объекту, исправленному им.