Handlebar.js沒有刷新我的模板

Question

好。 我的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”。

它與“編譯”有關嗎？

Answer 1

你第一次這樣做：

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

你的<div>變成了這個：

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

而你的模板已經消失了。 移動模板：

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

到#content-placeholder之外的某個地方。