angularjs - 将函数从控制器范围传递到指令隔离范围

Question

我正在使用 AngularJS，并试图将控制器范围内的函数传递给指令的隔离范围。

我知道我以前做过，但这次遇到了问题。

该函数接受两个输入，并将它们记录到控制台。

但是，当我将它传递给我的指令时

<div my-dir my-function="functionName"></div>

或者

<div my-dir my-function="functionName()"></div>

并尝试从我的指令控制器中调用它，我实际上得到了一个不带参数并返回我的函数的函数。

也就是说，而不是调用

ctrl.functionName(a,b)

我得打电话

ctrl.functionName()(a,b)

任何帮助将不胜感激。

我已经看到了一些这样的语法参考：

 <div my-dir my-function="functionName({})"></div>

Answer 1

html:

<div my-dir my-function="functionName()"></div>

指示：

angular.directive('myDir', function() {
  return {
    scope: {
      callback: '&myFunction'
    },
    controller: function($scope) {
      $scope.callback({param1: val1, param2: val2});
  };
});

Answer 2

尝试使用范围隔离的以下代码：

angular.module("Demo", [])  
  .controller("ChildCtrl", function($rootScope, $scope) {
    $scope.testFunc = function (a, b) {
        return a + b;
    }
 })
.directive("isoElement", function() {
  return {
    restrict: "E",
    scope: {
        testFunc: '&'
    },
    link: function(scope) {
      console.log(scope.testFunc()(1, 2));
    }
  };
}); 

指令用法将是：

<div ng-app="Demo" ng-controller="ChildCtrl">
    <iso-element test-func="testFunc"></iso-element>
</div>

您将需要执行 scope.testFunc()(..) 因为 scope.testFunc() 将返回函数本身。IMO 这比从另一个方面解决问题更容易理解。