如何将变量中的可执行动作（＆）传递给指令？

问题描述：

<div click aaa="aaa()" action="action"></div>

控制器：我喜欢在$ scope.action传递函数BBB（）：

app.controller('MainCtrl', function($scope) { 
    $scope.aaa = function() { alert('aaa'); } 
    $scope.bbb = function() { alert('bbb'); } 

    $scope.action = 'bbb()'; 
});

指令：

app.directive('click', function() { 
    return { 
     scope: { 
      aaa: '&', 
      action: '&' 
     }, 
     template: 
      '<button ng-click="aaa()">show aaa (work ok)</button>' + 
      '<button ng-click="action">show bbb (not work)</button>' + 
      '<br>How to pass ng-click action in variable into directive?' 
    } 
});

我不知道如何评估action将被替换为bbb()。

这里是plunker：http://plnkr.co/edit/d8DtsNARKPPJwk2SO2WJ

答

$scope.action必须是一个指针$scope.bbb，而不只是一个字符串，它指的是它松散。控制器中的"bbb()意味着什么，而$scope.bbb()是您创建和需要使用的。当你使用HTML时，暗示$scope，这就是为什么你可以简单地写aaa()。

在您的模板和HTML中，您还需要拨打action，就像您拨打aaa一样。

http://jsfiddle.net/DFcJf/

HTML

<div ng-app="app" ng-controller="MainCtrl"> 
    <div click aaa="aaa()" action="action()"></div> 

</div>

的JavaScript

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

app.directive('click', function() { 
    return { 
     scope: { 
      aaa: '&', 
      action: '&' 
     }, 
     template: 
      '<button ng-click="aaa()">show aaa (work ok)</button>' + 
      '<button ng-click="action()">show bbb (not work)</button>' + 
      '<br>How to pass ng-click action in variable into directive?' 
    } 
}); 
app.controller('MainCtrl', function($scope) { 
    $scope.aaa = function() { alert('aaa'); } 
    $scope.bbb = function() { alert('bbb'); } 

    $scope.action = $scope.bbb; 
});

如何将变量中的可执行动作（＆）传递给指令？

相关推荐