我正在尝试制作一个指令元素,该指令元素将使用json对象数组并创建一系列按钮。首先,我想我将尝试使用左右按钮进行操作。这是我尝试使用它的方式
<div ng-controller="FormCtrl as form">
<buttongroup
left-func="form.cancel()" left-text="Reject Call"
right-func="form.submit()" right-text="Accept Call">
</buttongroup>
</div>
这是指令代码
.directive('buttongroup', function() {
return {
restrict: 'E',
scope: {
leftFunc: '@',
leftText: '@',
rightFunc: '@',
rightText: '@'
},
template: '<button type="button" ng-click="{{leftFunc}}">{{leftText}}</button><button type="button" ng-click="{{rightFunc}}">{{rightText}}</button>',
};
});
这将创建正确的html,但是ng-click
在按钮上不起作用。我假设这是因为它们在指令的模板范围内,并且无法以form.submit
或访问FormCtrl函数form.cancel
。
我是Angel的新手,但仍在尝试弄清楚范围界定的工作原理,因此将不胜感激。
您要调用该函数,因此需要对其进行调用。您的模板中存在语法错误。它必须是这样的:注意我如何使用ng-click
指令
template: '<button type="button" ng-click="leftFunc()">{{leftText}}</button><button type="button" ng-click="rightFunc()">{{rightText}}</button>'
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句