Mustache.js 格式编号函数

Question

我正在尝试在我的 jquery 代码中使用 mustache.js。
不幸的是，我在使用函数格式化数值时遇到问题。

var data = {
  "price": 12000.00,
  "format": function () {
     return function (text, render) {
       return Number( render(text) ).toLocaleString( "it-IT", { maximumFractionDigits: 2 } ) + ' &euro;';
     }
   }
}

var template = "{{#format}}Formatted price : {{price}} {{/format}}";
var text = Mustache.render(template, data);
//output --> NaN €

我尝试使用 parseInt 而不是 Number，但结果相同。
我怎么能这样做？谢谢

Answer 1

Mustache 不是为这类事情而生的，因为它旨在减少逻辑。它确实支持自定义功能，但不会很优雅。在 Mustache 中，您需要在将数据传递给渲染器之前 完成所有格式设置。

像这样的小胡子模板的过程 {{#format}}{{price}}{{/format}} 是：

format 被调用，它获取原始文本 ('{{price}}') 作为参数 #1 和一个特殊的 render() 函数作为参数 #2.

您调用 render(text)（这会导致 {{price}} 的计算结果）

您对此结果进行修改 return。

这意味着您的模型中有一个数字。 render(text) 把它变成一个字符串。然后您必须再次将该字符串解析回数字并根据您的语言环境重新格式化它。这是一种非常迂回的方式，如果您预先格式化数字并且不要尝试将鞋拔到小胡子中，它真的会容易得多。

为了后代，下面是使用 Mustache 时的样子：

var data = { price: 12000.5, format: function () { return function (text, render) { var result = render(text); return parseFloat(result).toLocaleString("it-IT", { minimumFractionDigits: 2, maximumFractionDigits: 2 }); } } } var template = "Formatted price: {{#format}}{{price}}{{/format}} €"; var result = Mustache.render(template, data); document.querySelector("#output").textContent = result;

<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/3.0.1/mustache.min.js"></script> <div id="output"></div>

Mustache.js 格式编号函数

Mustache.js function for format number

jquery

mustache