iCanHaz.js +鼠标缓存不呈现数据对象中的第一行

Question

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

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

下面是我的JS代码：

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

和我的Moustache模板：

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

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

<br />
Title Two<br />

正如您所看到的，JSON对象中的"Title One“没有显示出来。

有人知道为什么吗？我猜测这与我的JSON对象(数组/对象)结构不正确有关。

非常感谢。

Answer 1

尝试将原始标志(第二个参数)设置为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标志，它将返回一个由node元素组成的数组，您需要设置一个根级元素才能使其工作。

<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);