如何在仅接受字符串值/文字的 HTML 属性中调用函数？答案

【问题标题】：How to call function in an HTML attribute that only accepts string values / literals?如何在仅接受字符串值/文字的 HTML 属性中调用函数？
【发布时间】：2015-04-01 04:09:55
【问题描述】：

我在调用此翡翠文件的属性中的函数时遇到问题：

test.jade

script
    - function myFunction(str) {
        some regex on str, say, to filter out all full stops and 
        return the new string.
    }

    .container-fluid
        .row
            .col-md-12
                div(ng-repeat='thing in things')
                    button(popovertext='{{thing.description()}}', popover-trigger='mouseenter')

popovertext 属性中的表达式在不调用函数的情况下为 things 中的每一件事打印字符串（如 ng-repeat 所做的那样）。但据我所知，popovertext 只接受字符串值，所以当我做类似的事情时

                    button(popovertext='myFunction({{thing.description()}})')

它实际上打印出 myFunction(....the original string....)，这基本上意味着它根本无法识别我的函数。我应该在这个jade文件中调用该函数，而不是在另一个.js文件中调用，因为显然任何没有'ng-'的属性根本不与控制器通信？

我怎么可能解决这个问题？

另外，我很困惑何时应该在我的代码行前面加上“-”。我说得对吗，对于玉来说，我需要它来用于 var、function 和 return？

【问题讨论】：

我对 Jade 了解不多，但在 Angular 中，拥有“ng-something”属性并不重要，而是将该函数或数据绑定到控制器的范围。跨度>
对不起，写了这么长的例子：here plunk not working

标签： javascript html angularjs function pug

【解决方案1】：

解决此问题的一种可能方法是为所有事物对象设置名为 descriptionString 的字段。您可以在控制器中执行此操作：

angular.forEach(things, function(thing){
  thing.descriptionString = thing.description();
});

剩下的很简单：

button(popovertext='{{thing.descriptionString}}', popover-trigger='mouseenter')

【讨论】：