在mustache.js模板中进行简单的计算

Question

是否可以在mustache.js模板中进行计算？

我希望将一个名为ratio的值复数固定的数量，例如240

我的标签看起来像这样：

<div><img src="https://s3.amazonaws.com/com.myapp.demo/{{url}}" class="item" style="height:{{ratio * 240}}"></div>

由于url值正确显示，我觉得必须是导致我麻烦的计算。

Answer 1

选项1

您可以使用以下功能执行此操作：

模板：

<div>
  <img src="https://s3.amazonaws.com/com.myapp.demo/{{url}}" 
       class="item" style="height:{{#ratio}} {{x240Times}} {{/ratio}}">
</div>

代码：

Mustache.render(template,{
 ratio: 2,
 x240Times: function() {
    return this.ratio * 240;
  }
});

选项2

您还可以使用我的扩展程序mustache-wax在模板中使用格式化程序，例如：

定义＆＃34;乘法＆＃34; formatter接受一个参数：

Mustache.Formatters = {
    "multiply": function (value, multiplier) {
        return value * multiplier;
    }
}

在模板中使用它：

<div>
  <img src="https://s3.amazonaws.com/com.myapp.demo/{{url}}" 
       class="item" style="height:{{ratio | multiply:240}}">
</div>