javascript - 如何在小胡子中将十进制格式格式化为货币格式？

Question

我正在使用 mustache 来呈现通过 Ajax 接收到的 json 数据。

我想以货币格式呈现这个数字：

{{price}}

例如：12300

我怎样才能将它呈现为：

"12,300"

使用 mustache 模板引擎？

Answer 1

Mustache 非常简约，不为此提供任何支持。

您必须提供格式化数据或返回格式化数据的函数

{ priceDecimal: function () { return formatDecimal(this.price); } }

另一种选择是使用支持辅助函数的handlebars.js

Handlebars.registerHelper('decimal', function(number) {
  return formatDecimal(number);
});

并像这样使用它

{{decimal price}}

Answer 2

虽然我同意Lucero 的回答，但可以使用Mustache 中的函数来格式化您的数据。

简单模板：

<ul>
    {{#price}}
        <li>{{commaFormat}}</li>
    {{/price}}
</ul>

JavaScript 使用格式化函数处理您的价格数据：

var tpl = $('#tpl').html(),
    data = {
        price: ['1234', '123', '123456', '1234567890'],
        commaFormat: function() {
            // adapted from https://stackoverflow.com/questions/2901102/how-to-print-number-with-commas-as-thousands-separators-in-javascript
            return this.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        }
    },
    html = Mustache.to_html(tpl, data);

document.write(html);​

生成的 HTML：

<ul>
    <li>1,234</li>
    <li>123</li>
    <li>123,456</li>
    <li>1,234,567,890</li>
</ul>

这是用于进一步检查和使用的工作 jsFiddle 。

Answer 3

我为 Mustache.js 创建了一个小扩展，它可以在表达式中使用格式化程序，例如 {{expression | 格式化程序}}

您可以在 github 中查看：http: //jvitela.github.io/mustache-wax/

Answer 4

在将模型传递给 mustache（或任何模板引擎）之前，您应该这样做。除了能够进行字符串操作之外，问题在于并非所有国家/地区的数字格式都相同，因此显示表示可能会有所不同，并且不应在模板中进行硬编码。

Answer 5

我使用来自https://www.npmjs.com/package/handlebars.numeral的 Handlebars NumeralHelper 包

首先，安装（并可选择将其保存到 package.json）：

npm install --save handlebars.numeral

接下来，加载帮助程序：

var Handlebars = require('handlebars');
var NumeralHelper = require("handlebars.numeral");
NumeralHelper.registerHelpers(Handlebars);

最后，在您的页面中使用它：

<script>
myNumber = 12300:
</script>

 <div>
 {{ number myNumber }}
 </div>

此示例的输出是12,300.