Question

我有一个JSON数据对象和一个使用Mustache语法编写的text / html javascript模板。我正在使用iCanHaz.js作为模板解析器。

我的问题是数据对象的第一行没有显示。

这是我的JS代码：

 var data = jQuery.parseJSON('{"data":[{"title":"Title One"}, {"title":"Title Two"}]}');
 var html = ich.data_template(data);

我的胡子模板：

<script type="text/html" id="data_template">
    {{#data}}
       {{title}}<br />
    {{/data}}   
</script>

上面的代码将此输出为我呈现的HTML：

<br />
Title Two<br />

正如您所见，JSON对象中的“Title One”未显示。

有谁知道为什么？我猜测它与我的JSON对象没有正确构造（数组/对象）有关。

非常感谢。

Answer 1

尝试将raw标志（第二个参数）设置为true。

var data = jQuery.parseJSON('{"data":[{"title":"Title One"}, {"title":"Title Two"}]}');
var html = ich.data_template(data, true); #Note the true.

另外，为什么要将JSON编写为字符串并进行解析？你可以这样做：

var data = {"data": [{"title": "Title One"}, {"title": "Title Two"}]};
var html = ich.data_template(data, true);

如果没有raw标志，它将返回一个节点元素数组，您需要设置一个根级别元素才能工作。

<script type="text/html" id="data_template">
    <div>
    {{#data}}
       {{title}}<br />
    {{/data}}   
    </div>
</script>

您可以通过在控制台中运行以下JavaScript来对此进行测试。

ich.addTemplate('data_template', '{{#data}}{{title}}<br />{{/data}}');
var data = {"data": [{"title": "Title One"}, {"title": "Title Two"}]};
var html = ich.data_template(data, true);
console.log(html);

html = ich.data_template(data);

console.log(html);

ich.addTemplate('data_template_root', '<div>{{#data}}{{title}}<br />{{/data}}</div>');

html = ich.data_template_root(data, true);
console.log(html);

html = ich.data_template_root(data);

console.log(html);

iCanHaz.js + Mustache不会在数据对象中呈现第一行

1 个答案: