angularjs - 如何将方法 ref 从主控制器传递给指令

Question

我在主控制器中定义了一个函数getData，我想在我的指令中使用它。我尝试在范围内包含该功能，但似乎我仍然缺少某些东西或做错了。

plunker 链接到我的测试用例

var app = angular.module('plunker', []);

app.directive("position", function(){
   return {
       restrict:'A',
       template: "<tr><td ng-repeat='(key,value) in position'>{{getData(key,value,$index)}}</td></tr>",
       replace: false,
       scope: {
         position: '=',
         getData: '&'
       }
   };
});

app.controller('MainCtrl', function($scope) {
   $scope.name = 'World';
   $scope.positions = [{ Name: "Quarterback", Code: "QB" },
                       { Name: "Wide Receiver", Code: "WR" }
                      ]; 
   $scope.getData=function(key , value,index){
       return '|' + value + '|';
   }
});

Answer 1

当使用 Isolate $scope 和 "&" 时，这意味着您要从 HTML 中传入对该方法的引用。您可以将 $scope 定义保留在指令中。例如：

<table border=1>
  <tr ng-repeat="item in positions" position="item" get-data="getData(item.Name, item.Code, $index)"></tr>
</table>

在这里，我将 get-data 传递给您的指令（注意不同之处，我们在 HTML 中是蛇形大小写，在 $scope 中我们被引用为 getData）。然后，您可以在模板中引用此 getData 实例。

Answer 2

改用这个

{{$parent.$parent.getData(key,value,$index)}}

首先$parent是到达指令中定义的转发器的父范围。第二$parent是达到指令的父范围。