2015-12-02 117 views
0

我试图做一个基本的绘图程序使用角度触摸模块和$刷卡服务以及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的手机,但angularjs和angularjs触摸加载后的jQuery和jQuery的移动。有谁知道为什么这不工作?

回答

0

我发现我的问题是对this对象的引用,这是在$swipe将它们转换为普通变量而不是将其附加到此对象中进行定义之后定义的。