gpt4 book ai didi

javascript - 有没有办法将多个函数传递给 AngularJS 指令?

转载 作者:行者123 更新时间:2023-11-30 17:15:31 27 4
gpt4 key购买 nike

我正在构建一个下拉菜单指令,它允许您有选择地将一个函数附加到列表中的每个项目。我知道如何将每个属性的一个函数传递给指令,但我希望有一种方法可以传递多个函数。

<dropdown items="['item1', 'item2']" actions="['action1()', 'action2()']"></dropdown>

或者更好:

<dropdown items="[{'item1':action1()}, {'item2':action2()}]"></dropdown>

可用于生成:

<dropdown items="['item1', 'item2']" actions="['action1()', 'action2()']">
<a ng-click="action1()">item1</a>
<a ng-click="action2()">item2</a>
</dropdown>

最佳答案

您可以在范围内使用 = 对象表示法来接受具有可分配给指令的属性的对象数组

DEMO

Controller

  .controller('Ctrl', function($scope) {

var action = function() {
window.alert(this.label);
};

$scope.items = [{
label: 'Item 1',
action: action
}, {
label: 'Item 2',
action: action
}, {
label: 'Item 3',
action: action
}, {
label: 'Item 4',
action: action
}];
})

指令

  .directive('dropdown', function() {
return {
restrict: 'E',
scope: {
items: '='
},
template:
'<div ng-repeat="item in items track by $index" ng-click="item.action()">' +
'<a ng-bind="item.label"></a>' +
'</div>'
};
});

index.html

  <body ng-controller="Ctrl">
<dropdown items="items"></dropdown>
</body>

关于javascript - 有没有办法将多个函数传递给 AngularJS 指令?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26198638/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com