Question

我正在使用模板和隔离范围创建可重用的组件/窗口小部件作为指令。我希望能够将回调发送到指令并在小部件中调用它。这可能吗？有点像...

mainView模板： <my-widget callback="someFunction"></my-widget>

指令：

return {
    restrict: 'E',
    scope: {
        callback: '='
    },
    templateUrl: '/partials/widget.html',
}

模板：

<input type="text" ng-change="callback()" />

因此，当窗口小部件值更改时，它会触发在主视图中传递的回调函数

Answer 1

您正在寻找的是&。 Quoting the old angular docs：“＆amp;或＆amp; attr - 提供了在父范围的上下文中执行表达式的方法”。

尝试将此作为指令代码：

return {
    restrict: 'E',
    scope: {
        callback: '&'
    },
    templateUrl: '/partials/widget.html',
}

Answer 2

您还可以在链接或控制器中查看它。

.directive('myDirective', function() {

  return {
    restrict: 'E',
    link: function(scope, element, attrs) { {
      scope.$watch(attrs.myDirective, function(value){ ... });
    }
   ...

Answer 3

原来我需要按照建议做，并使用＆amp;而不是一个=，但是在我将ng-model添加到我的输入之前，这仍然不起作用：

<input type="text" ng-model="myValue" ng-change="callback()" />

AngularJS;从父级发送函数到指令范围

3 个答案: