Question

我试图将回调函数从控制器传递给指令。

这里是回调函数代码：

$scope.onImageSelect = function(image) {
    alert('SET');
    $scope.card.image = image;
};

指令用法：

<google-image-search callback="onImageSelect" />

指令代码：

ngmod.directive('directive', function() {
    return {
        templateUrl: '/templates/template.html',
        scope: {
            callback: '&'
        }
    }
});

模板中的回调用法：

<a data-ng-click="callback(url)"></a>

然而，这给了我以下错误：

TypeError: Cannot use 'in' operator to search for 'onImageSelect'

我看过很多类似的问题，但无法理解我错在哪里。

Answer 1

从指令调用表达式方法时，您需要以JSON格式从指令传递参数，同样您应该更正指令callback属性值以传递callback="onImageSelect(image)"之类的函数

指令用法：

<google-image-search callback="onImageSelect(image)" />

指令模板

<a data-ng-click="callback({image: url})"></a>

Answer 2

只需使用：

<google-image-search callback="onImageSelect(image)" />

AngularJS developer guide中的此示例与您的案例非常相似：http://plnkr.co/edit/hYBxk070sgw54RElyWNq?p=preview

Answer 3

以下代码已通过测试并可以正常工作。

Directive call in html

<taxcode-picker call-back-fun="calculate_tax(a, b)"></taxcode-picker>

示例指令代码

{
scope:'&',
link: function (scope, element, attrs) {
 scope.tax = {amount:12, rate:10.50};
 scope.obj = {number:12, value:10};

  scope.call_back = function (tax) {
    scope.callBackFun({a:tax, b:obj});
  }
}

}

样品控制器

app.controller("sample", function($scope){
$scope.calculate_tax = function (tax, obj) {

        console.log("tax "+JSON.stringify(tax));

        console.log("obj "+JSON.stringify(obj));
    }
});

Answer 4

许多AngularJs开发人员已经了解AngularJs指令，并且可能知道指令范围及其方法。

如您所知，有3种AngularJs指令范围方法：＆＃39; @＆＃39;，＆＃39; =＆＃39;，＆＃39;＆amp;＆＃39;，但现在我们是只谈及＆＃39;＆amp;＆＃39;方法。我们将看到，我们如何实施方法＆＃39;＆amp;＆＃39;在我们的应用程序中。

当我们在当前范围内定义任何函数并希望将其实现到任何指令时，请记住一件事：你必须注意你的函数的参数及其顺序。如果你想要更多这里是一篇很棒的文章关于它：

http://www.w3docs.com/snippets/angularjs/angularjs-directive-scope-method.html

Answer 5

尝试将范围对象更改为此

execProg

它会起作用

将回调函数传递给指令

5 个答案: