Handlebar.js没有刷新我的模板

时间:2011-08-19 03:04:54

标签: javascript handlebars.js

行。我的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时,它会告诉我“未捕获的TypeError:无法调用方法'匹配'为null”。

与“编译”有关吗?

1 个答案:

答案 0 :(得分:5)

你第一次这样做:

$("#content-placeholder").empty()...

您的<div>变成了这个:

<div id="content-placeholder">
</div>

你的模板已经消失了。移动模板:

<script id="some-template" type="text/x-handlebars-template">
    ...
</script>

#content-placeholder以外的某个地方。