如何使用模型中的函数表达式将函数动态绑定到 ng-click [英] How to dynamically bind function to ng-click using the function expression from model

问题描述

我的 Angular 模板中有以下元素来生成带有 Font Awesome 图标的按钮栏:

I have the following element in my Angular template to generate a button bar with Font Awesome icons:

<li 
    data-ng-repeat="btn in navigation.buttonBar" 
    data-ng-click="{{ btn[1] }}"
    class="btn btn-default" style="font-size: 30px; vertical-align: middle;"
    tooltip-placement="bottom" tooltip="{{ btn[2] }}">
        <i class="fa {{ btn[0] }}"></i>
</li>

navigation.buttonBar 是以下数组:

navigation.buttonBar is the following array of arrays:

文本和图标呈现正确，但生成的按钮不起作用.当我检查元素时，我看到 btn[1] 已正确展开.我应该用什么替换 {{ btn[1] }} 以使其正常工作?

[ [ "fa-minus", "less()", "Show fewer cloud buttons." ], [ "fa-plus", "more()", "Show more cloud buttons." ], [ "fa-minus-square", "smaller()", "Make cloud buttons smaller." ], [ "fa-plus-square", "bigger()", "Make cloud buttons bigger." ], [ "fa-bars", "toggleShowStrings()", "Toggle display of matching strings." ], [ "fa-refresh", "initialize();", "Load more content." ], [ "fa-undo", "resetQuery()", "Clear query." ] ]

推荐答案

我认为您不能仅仅将函数表达式指定为绑定中的字符串.如果你尝试使用插值，它会抛出语法错误，如果你将它用作绑定，它也没有用.相反，您可能需要使用 $parse 并做这样的事情.

解决方案

I don't think you can just assign the function expression as string from a binding. If you try to use interpolation it is going to throw syntax error, If you use it as binding it is of no use as well. Instead you would need to probably use $parse and do something like this.

在您看来:-

In your view do:-

这篇关于如何使用模型中的函数表达式将函数动态绑定到 ng-click的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！