Question

我是棱角分明的新手并且还在做事。我想问一下是否可以在角度js中启动ng-click变量（哪些是函数。）？这是我的代码片段

<div data-ng-controller="DeathRayController">
    <button data-ng-click="toggleMenu()">Toggle Menu</button>
    <ul ng-show="menuState.show">
        <li data-ng-repeat="menu in menuList"><a href="" data-ng-click="menu.mode">{{ menu.value }}</a></li>
    </ul>
</div>

这是我的控制器使用angularjs：

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

showHide.controller('DeathRayController', function ($scope) {
// the idea is to display this on the <a ng-click="menu.mode">
    $scope.menuList = [
        { mode: 'stun()', value : 'Stun' },
        { mode: 'disinegrate()' ,value : 'Disinegrate' },
        { mode: 'erase()', value : 'Erase' },
    ];
    $scope.menuState = { show: false };
    $scope.toggleMenu = function() {
        $scope.menuState.show = !$scope.menuState.show;
    };
    $scope.stun = function() {
        alert('Snorlax is stunned!');
    };
    $scope.disinegrate = function() {
        alert('Charizard used Disinegrate!');
    };
    $scope.erase = function() {
        alert('erased Sleep skill');
    };
});

如果还不清楚请告诉我。

Answer 1

在你的控制器中，当你定义menuList数组时，不要将mode设置为字符串，而是设置为实际的函数

$scope.menuList = [
    { mode: $scope.stun, value : 'Stun' },
    { mode: $scope.disinegrate ,value : 'Disinegrate' },
    { mode: $scope.erase, value : 'Erase' },
];

然后在你的标记中：

data-ng-click="menu.mode()"

这是工作代码link

Answer 2

在将函数指定给object之前定义函数。将它们指定为

$scope.menuList = [
    { mode: $scope.stun, value : 'Stun' },
    { mode: $scope.disinegrate ,value : 'Disinegrate' },
    { mode: $scope.erase, value : 'Erase' },
];

并在html中使用它们

<ul>  
 <li data-ng-repeat="menu in menuList"><a href="" data-ng-click="menu.mode()">{{ menu.value }}</a></li>
</ul>

查看：

<div data-ng-controller="DeathRayController"> <button data-ng-click="toggleMenu()">Toggle Menu</button> <ul ng-show="menuState.show"> <li data-ng-repeat="menu in menuList"><a href="" data-ng-click="menu.mode()">{{ menu.value }}</a></li> </ul> </div>

<强>控制器：

var showHide = angular.module('showHide', []); showHide.controller('DeathRayController', function ($scope) { // the idea is to display this on the <a ng-click="menu.mode()"> $scope.stun = function() { alert('Snorlax is stunned!'); }; $scope.disinegrate = function() { alert('Charizard used Disinegrate!'); }; $scope.erase = function() { alert('erased Sleep skill'); }; $scope.menuList = [ { mode: $scope.stun, value : 'Stun' }, { mode: $scope.disinegrate ,value : 'Disinegrate' }, { mode: $scope.erase, value : 'Erase' }, ]; $scope.menuState = { show: false }; $scope.toggleMenu = function() { $scope.menuState.show = !$scope.menuState.show; };

}）;

小提琴：http://jsfiddle.net/rVCV2/1/

通过数组传递函数

2 个答案: