Question

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

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和“＆amp;”时，表示您将从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将到达指令的父范围。

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

2 个答案: