javascript - AngularJs値変更$watchの非表示入力で関数を呼び出す

Question

これらの 3 つの値のいずれかが変更されるたびに関数をトリガーするために $watch を使用したい:

html:

<input type="hidden" name="source_x" id="source_x" ng-model="source_x"/>
<input type="hidden" name="source_y" id="source_y" ng-model="source_y"/>
<input type="hidden" name="id" id="id" ng-model="id"/>

angular を開始したばかりで、$watch を使用して関数をトリガーしたいと考えています。これらの値は、以下のドラッグ可能な関数を使用して 1 つの div をドラッグするたびに変更されます。

$("#div").draggable({
         helper : 'clone',
    stop:function(event,ui) {
        var wrapper = $("#container-emote").offset();
        var borderLeft = parseInt($("#container-emote").css("border-left-width"),10);
        var borderTop = parseInt($("#container-emote").css("border-top-width"),10);
        var pos = ui.helper.offset();
        $("#source_x").val(pos.left - wrapper.left - borderLeft);
        $("#source_y").val(-(pos.top - wrapper.top - borderTop)+185);
        $("#id").val(2);
    }
    });

私はこれから始めましたが、1つのdivを移動すると関数を3回呼び出すので、正しくないと思いますか? さらに、入力を非表示にして使用できるかどうかもわかりません..ありがとうございます！

    //Fonction
$scope.$watch($scope.source_x, createEmote);
$scope.$watch($scope.source_y, createEmote);
$scope.$watch($scope.id, createEmote);

function createEmote(newValue, oldValue, scope){

                    }

更新:フィドルに答えるドラッグの停止の最後に関数を追加するだけです

jsfiddle.net/5e7zbn5z/1/