Question

带有指令的HTML视图：

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

Controller：我喜欢在$ 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

Answer 1

$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;
});

如何将变量中的ng-click可执行操作（＆amp;）传递给指令？

1 个答案: