Javascript 如何从指令中调用控制器方法？

如何从指令

调用控制器方法
onDrag（）

Html/（SVG）
控制器
如果我没有正确地执行此操作，我不介意更改我的方法，那么最好在同一个g元素上的另一个html标记中传递要调用的方法，比如drag=“vm.onDrag（）”

更新
根据建议，我已更改代码：

<g ng-controller="EntityController as vm" on-drag="vm.drag()" draggable>

app.directive('draggable', ['$document', function ($document) {
        return {
            scope: {
                onDrag: '&'
            },
            link: ...
        }
}

vm.drag = function() {
    alert("you dragged something!");
};


应用程序指令（'draggable'，['$document'，函数（$document）{
返回{
范围：{
翁德拉格：“&”
},
链接：。。。
}
}
vm.drag=函数（）{
警惕（“你拖了东西！”）；
};

警报未触发
您应该将该功能传递给您的指令，您可以这样做：

app.directive('draggable', ['$document', function($document) {
return {
    scope: {
        updateFn: '&'
    },
    link: function(scope, element, attr) {
        var startX = 0, startY = 0, x = 0, y = 0;

        element.on('mousedown', function(event) {
            event.preventDefault();
            startX = event.pageX - x;
            startY = event.pageY - y;
            $document.on('mousemove', mousemove);
            $document.on('mouseup', mouseup);
        });

        function mousemove(event) {
            y = event.pageY - startY;
            x = event.pageX - startX;
            element.attr("transform", "translate(" + x + "," + y + ")");
            scope.updateFn(); // this fires the callback
        }

        function mouseup() {
            $document.off('mousemove', mousemove);
            $document.off('mouseup', mouseup);
        }
    }
};
}]);

然后，您应该将所需的函数传递给您的指令，如下所示：

<g ng-controller="EntityController as vm" draggable update-fn="vm.onDrag()"> ... </g>

。。。

现在，在指令的link函数中，您可以在希望执行控制器的onDrag函数的任何位置调用scope.updateFn（）。
您可以在此处找到有关这意味着什么的更多信息：
您应该将函数传递给指令，您可以这样做：

app.directive('draggable', ['$document', function($document) {
return {
    scope: {
        updateFn: '&'
    },
    link: function(scope, element, attr) {
        var startX = 0, startY = 0, x = 0, y = 0;

        element.on('mousedown', function(event) {
            event.preventDefault();
            startX = event.pageX - x;
            startY = event.pageY - y;
            $document.on('mousemove', mousemove);
            $document.on('mouseup', mouseup);
        });

        function mousemove(event) {
            y = event.pageY - startY;
            x = event.pageX - startX;
            element.attr("transform", "translate(" + x + "," + y + ")");
            scope.updateFn(); // this fires the callback
        }

        function mouseup() {
            $document.off('mousemove', mousemove);
            $document.off('mouseup', mouseup);
        }
    }
};
}]);

然后，您应该将所需的函数传递给您的指令，如下所示：

<g ng-controller="EntityController as vm" draggable update-fn="vm.onDrag()"> ... </g>

。。。

现在，在指令的link函数中，您可以在希望执行控制器的onDrag函数的任何位置调用scope.updateFn（）。
您可以在此处找到有关这意味着什么的更多信息：
当您使用
EntityController作为vm
时，vm可以作为范围变量使用。因此，在原始代码中，您可以将controller方法作为

scope.vm.onDrag(x, y)

请参阅工作示例
当您将
EntityController用作vm时
，vm可用作范围变量。因此，在原始代码中，您可以将controller方法称为

scope.vm.onDrag(x, y)

请参阅工作示例
我想它回答了您的问题。这个答案解释了如何将回调传递给您的指令（在您的例子中是
onDrag（））
将是回调。如果您计划在控制器中调用回调时将参数传递给回调，请参阅此答案。希望这有帮助。我想这回答了您的问题。此答案解释了如何将回调传递给您的指令（在您的情况下为
onDrag（）
将是回调函数。如果您计划在控制器中调用回调函数时将参数传递给回调函数，请参阅此答案。希望这有帮助。您的链接函数看起来如何？您在哪里调用了scope.onDrag（）？编辑您的mousemove函数并添加scope.onDrag（））你的链接函数看起来怎么样？你在哪里调用了scope.onDrag（）？编辑你的mousemove函数并添加scope.onDrag（）我不确定这是如何工作的，当我尝试类似的东西时，我的scope.vm是未定义的。你能发布你用过的代码吗？检查我jsBin中的Html。也许，这是有区别的。我不确定这是如何工作的，当我尝试类似的东西时，我的scope.vm是未定义的。你能发布你用过的代码吗？检查Html在我的jsBin中。也许，这是有区别的。