Javascript 如何触发自定义指令上的方法？

我在模板中使用了一个自定义指令。这对我来说有点作用。我希望在中使用该指令的主机视图/控制器能够在我的指令（及其控制器）上运行方法。但我不确定如何最好地调用指令范围

我的视图代码：

<div ng-app="app">
    <div ng-controller="MainCtrl">
        <h3>Test App</h3>
        <button ng-click="scopeClear()">Parent Clear</button>
        <div my-directive string="myString"></div>
    </div>
</div>

我找到的解决方法是jQuery（“#my_指令”）.scope（）.myMethod（）；但这似乎是错误的，好像我错过了做这件事的更好的部分

而且$emit似乎不在这里，因为我需要一个目标方法，这样它就不会在同一页上的其他指令实例上触发

---

如何从我的父控制器访问指令方法？

我不确定我是否完全理解您在这里的目标，您有可能完全找到更好的模式。通常，指令显示作用域的状态，该作用域要么是隔离作用域（如果它们是自给自足的），要么是共享作用域。因为您没有创建隔离作用域，所以它们从控制器继承作用域。如果它们显示从控制器继承的数据，那么您不希望您的控制器调用指令，而是只要控制器中的属性发生更改，指令就会简单地“重新绘制”自身

相反，如果您希望根据指令外部的事件重新计算指令中的某些内容，则不希望出现任何紧密耦合，尤其是在构建完全独立的模块时。在这种情况下，您可能只想在MainCtrl中使用$scope中的$broadcast来广播您可能关心的事件，然后您的指令可以提供$on（'eventName'）处理程序。通过这种方式，它可以移植到任何将触发此类事件的控制器/范围

---

如果您发现自己需要知道控制器中的确切属性或指令中的确切函数，那么我建议您将这些部分紧密耦合，它们不属于单独的模块，因为它们永远无法重用。角度指令和控制器不是具有函数的对象，而是创建作用域并在该作用域中的属性更改时通过$digest调用频繁更新的对象。因此，您可能能够找到一种更好地对正在显示的数据、对象和特性建模的方法。但是我不能说没有更大的上下文。

我的指令就像一个表单元素。如果我使用创建它，那么没有使用$emit/$broadcast，就没有办法获取数据或发送方法吗？正如您所发现的，有很多方法可以做到这一点，但效果并不好。角度的关键是以反应的方式渲染对象和属性。如果指令正在控制器中显示某个属性的值，则它将自动显示该属性的当前值，前提是该属性在摘要周期内被修改。当你在angular之外修改变量，然后试图强制消化等等的时候，你会陷入一大堆的麻烦、麻烦和头痛。如果您的指令实际上是一个表单，那么您很可能也希望使用Angular的双向数据绑定。如果指令对于构建交互式通用组件不是很好，那么我应该从角度看什么呢？我想我已经开始理解如何使指令变得有用了。如果我隔离作用域，我就可以在指令内外创建双向绑定，从而产生更多的交互式组件（没有黑客攻击）。谢谢你把我推向正确的方向！没问题！最大的心理转变是模型和作用域，而不是函数和dom绑定。如果您发现自己正在这样做，还可以使用共享作用域直接访问父控制器中的作用域。它的“安全性”稍差，因为您的控制器可能会更改，但如果情况需要，这样做是完全有效的。祝你好运这很有趣。

angular.module('components', []).directive('myDirective', function() {
    function link(scope, element, attrs) {
        scope.string = "";

        scope.$watch(attrs.string, function(value) {
            scope.string = value;
        });
    }

    return {
        controller: function($scope, $element) {
            $scope.reset = function() {
                $scope.string = "Hello";
            }
            $scope.clear = function() {
                $scope.string = "";
            }
        },
        template:
            "<button ng-click='reset()'>Directive Reset</button>" +
            "<button ng-click='clear()'>Directive Clear</button><br/>" +
            "<input type='text' ng-model='string'>",
        link: link
    }
});

angular.module('app', ['components']).controller('MainCtrl', function($scope) {
    $scope.myString = "Hello";

    $scope.scopeClear = function() {
        // How do I get this to call the clear() method on myDirective
    }
});