Javascript JQuery+；AngularJS:mousedown事件被多次调用

我在angular中有一个单页应用程序

我不能使用jquery可拖动的方法，所以我自己写了一个-

 // here I am setting the drag event to a div
var enableDrag = function(id){
        $('#'+id).on('mousedown',handleMousedown);
}

var handleMousedown =function (e){
    window.my_dragging = {};
    my_dragging.pageX0 = e.pageX;
    my_dragging.pageY0 = e.pageY;
    my_dragging.elem = this;
    my_dragging.offset0 = $(this).offset();
    var isDragAction=false;
    function handle_dragging(e){
        isDragAction=true;
        var left = my_dragging.offset0.left + (e.pageX - my_dragging.pageX0);
        var top = my_dragging.offset0.top + (e.pageY - my_dragging.pageY0);
        $(my_dragging.elem)
            .offset({top: top, left: left});
    }
    function handle_mouseup(e){
        $('body')
            .off('mousemove', handle_dragging)
            .off('mouseup', handle_mouseup);
        if(isDragAction){
            console.log("drag was done!!");
        }
        else{
            console.log("click was done!!");
        }

    }
    $('body')
        .on('mouseup', handle_mouseup)
        .on('mousemove', handle_dragging);
}

在我的方法中，我这样称呼它：

   //set off the last mousedwon to the div
   $("someDiv").off('mousedown',handleMousedown);
   //set the mousedwon to the div
   enableDrag("someDiv");

我需要在每次调用该方法时调用它，而不是仅仅调用一次，因为我的angular应用程序是如何工作的

拖动工作正常

问题是，每次调用该方法时，都会在以前的事件之外添加一个新事件

意思是：

正在调用第1个方法-拖动将打印到控制台：

"drag was done!!"

通过一次拖动调用第二个方法：

"drag was done!!"
"drag was done!!"

"drag was done!!"
"drag was done!!"
.
.
.
"drag was done!!"

正在调用n time方法，只需一次拖动：

"drag was done!!"
"drag was done!!"

"drag was done!!"
"drag was done!!"
.
.
.
"drag was done!!"

是什么累积了这些事件或导致了多次打印

---

谢谢

我真的认为这种操作应该在工厂或服务中进行，因为两者都是单例初始化，每次应用程序执行一次，而控制器可以初始化多次。另一个解决方案是安装控制器

$scope.$on('$destroy', function(){
  //unbind event
  $('#someDiv').unbind('mousedown', handleMousedown);
});

---

我真的认为这种操作应该在工厂或服务中进行，因为它们都是单例初始化，每次应用程序执行一次，而控制器可以初始化多次。另一个解决方案是安装控制器

$scope.$on('$destroy', function(){
  //unbind event
  $('#someDiv').unbind('mousedown', handleMousedown);
});

---

当控制器被销毁时，您需要解除单击事件的绑定

角度1.4

scope.$on(
    "$destroy",
    function handleDestroy() {
        $('#someDiv').unbind('mousedown', handleMousedown);
    }
);

角度1.5

this.$onDestroy = function () {
    $('#someDiv').unbind('mousedown', handleMousedown);
};

角度2

ngOnDestroy() {
    $('#someDiv').unbind('mousedown', handleMousedown);
}

---

当控制器被销毁时，您需要解除单击事件的绑定

角度1.4

scope.$on(
    "$destroy",
    function handleDestroy() {
        $('#someDiv').unbind('mousedown', handleMousedown);
    }
);

角度1.5

this.$onDestroy = function () {
    $('#someDiv').unbind('mousedown', handleMousedown);
};

角度2

ngOnDestroy() {
    $('#someDiv').unbind('mousedown', handleMousedown);
}

---

尝试确保事件只设置一次，方法是在设置之前将其删除，而不是单独设置。不确定这是否是问题所在，因为我没有在您的示例中测试它

var enableDrag = function(id) {
  $('#'+id).off('mousedown').on('mousedown', handleMousedown);
}

---

尝试确保事件只设置一次，方法是在设置之前将其删除，而不是单独设置。不确定这是否是问题所在，因为我没有在您的示例中测试它

var enableDrag = function(id) {
  $('#'+id).off('mousedown').on('mousedown', handleMousedown);
}

---

我提出我的问题-我需要在一个方法中使用它。。谢谢我提出我的问题-我需要在一个方法中使用它。。谢谢