好的。我的 HTML 如下所示。
<div id="json"></div>
<div id="content-placeholder">
<script id="some-template" type="text/x-handlebars-template">
<table>
<thead>
<th>col 1</th>
<th>col 2</th>
</thead>
<tbody>
{{#results}}
<tr>
<td>{{col_1}}</td>
<td>{{col_2}}</td>
</tr>
{{/results}}
</tbody>
</table>
</script>
</div>
我通过 Handlebar.js 填充上面的内容,数据是从服务器接收的。这是代码。
$.get(get_data_url, function(data)
{
$('#json').empty().append(data);
var rows = eval('(' + data + ')');
var source = $("#some-template").html();
var template = Handlebars.compile(source);
$("#content-placeholder").empty().append(template(rows));
});
当代码第一次运行时,它看起来很好。但是当我第二次调用 $.get 时(依此类推),模板不会用新数据刷新。
我还在 中打印出整个数据字符串,以确保数据正在从服务器刷新并且确实如此。
当我检查我的 Chrome 时,它告诉我“未捕获的类型错误:无法调用 null 的方法‘匹配’”。
与“编译”有关吗?
最佳答案
第一次这样做时:
$("#content-placeholder").empty()...
你的 <div>
变成这样:
<div id="content-placeholder">
</div>
你的模板不见了。移动您的模板:
<script id="some-template" type="text/x-handlebars-template">
...
</script>
到外面的某个地方#content-placeholder
.
关于javascript - Handlebar.js 不刷新我的模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7116522/