2

我在 Mustache.js 访问 json 数组的值时遇到问题，我需要一些帮助。

问题是当我想使用表格访问值时。[object Object]当它应该显示数组内容时，它总是显示。

下面是一个工作和非工作的例子：

<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="https://raw.github.com/janl/mustache.js/0.7.2/mustache.js"></script>
</head>
<body>
<div id="template" style="display:none">
  <p>Works but not what I need:</p>
  <p>{{#numbers}} {{.}} {{/numbers}} </p>
  <p>Doesn't work:</p>
  <table>
      <tr>
        {{#numbers}} <th> {{.}} </th> {{/numbers}}
      </tr>
  </table>
</div>
<div id="rendered"></div>
<script>
var json = {
  "numbers": [ 1, 2, 3 ]
  };
var compiledTemplate = Mustache.to_html($('#template').html(), json).replace(/^\s*/mg, '');
$('#rendered').html(compiledTemplate);
</script>
</body>
</html>

输出是：

Works but not what I need:
1 2 3
Doesn't work:
[object Object]

有没有办法解决这个问题或使用 mustache.js 打印对象属性？

这个问题已经在他们的问题系统中被问过了，还没有回复： https ://github.com/janl/mustache.js/issues/295

谢谢，马里亚诺。

4

3 回答 3

4

最后，这就是我所做的。

将 div 元素模板替换为 script 元素：

从<div id="template" style="display:none">到<script id="template" type="text/x-mustache-template">

并按预期工作=）

于 2013-02-20T12:07:41.223 回答
0

你想要这个吗？

<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="https://raw.github.com/janl/mustache.js/0.7.2/mustache.js"></script>
</head>
<body>
<div id="template" style="display:none">
  <p>Works but not what I need:</p>
  <p>{{#numbers}} {{.}} {{/numbers}} </p>
  <p>Doesn't work:</p>
  <table>
      <tr>
        {{#numbers}} {{{th}}} {{/numbers}}
      </tr>
  </table>
</div>
<div id="rendered"></div>
<script>
var json = {
  "numbers": [ 1, 2, 3 ],
  "th": function () {
    return "<th>" + this + "</th>"
  }
};
var compiledTemplate = Mustache.to_html($('#template').html(), json);
$('#rendered').html(compiledTemplate);
</script>
</body>
</html>
于 2013-02-19T09:19:58.340 回答
0

我花了很多时间调试这个。

问题是$('#template').html()。它返回损坏的 HTML，因为表格标记格式错误（外部的东西<th>由浏览器呈现在表格之外）

这就是为什么更改为有<script>帮助的原因

于 2018-11-15T22:10:34.037 回答