执行功能从变量称为AngularJS

Question

我的代码：

<li class="grid--col2of10" ng-repeat="button in buttons"> 
    <button ng-show="button.show" class="btn--action-{{button.color}} icon-{{button.icon}}" ng-click="{button.clickAction}">{{button.text}}</button> 
</li> 

我的目标：

var btns = { 
    "back": { 
     "color": "red", 
     "clickAction": "prevStep", 
     "icon": "left", 
     "text": "Back" 
    }, 
    "cancel": { 
     "color": "red", 
     "icon": "block", 
     "text": "Cancel" 
    }, 
    "clear": { 
     "color": "blue", 
     "icon": "cancel", 
     "text": "Clear" 
    }, 
    "save": { 
     "color": "green", 
     "icon": "download", 
     "text": "Save" 
    }, 
    "next": { 
     "color": "green", 
     "clickAction": "nextStep", 
     "icon": "right-after", 
     "text": "Save and Continue" 
    } 
    }; 

是否有可能使button.clickAction是在AngularJS执行的功能？

btns对象位于指令内，并且使用指令templateUrl选项调用html。

Answer 1

想通了。我不能在HTML执行它，但我把它通过调用我的指导对象的函数工作：

var btns = { 
    "back": { 
     "color": "red", 
     "clickAction": function() { prevStep(); }, 
     "icon": "left", 
     "text": "Back" 
    }, 
    "cancel": { 
     "color": "red", 
     "icon": "block", 
     "text": "Cancel" 
    }, 
    "clear": { 
     "color": "blue", 
     "icon": "cancel", 
     "text": "Clear" 
    }, 
    "save": { 
     "color": "green", 
     "icon": "download", 
     "text": "Save" 
    }, 
    "next": { 
     "color": "green", 
     "clickAction": function() { nextStep(); }, 
     "icon": "right-after", 
     "text": "Save and Continue" 
    } 
    }; 

和HTML：

<li class="grid--col2of10" ng-repeat="button in buttons"> 
    <button ng-show="button.show" class="btn--action-{{button.color}} icon-{{button.icon}}" ng-click="button.clickAction()">{{button.text}}</button> 
</li>