加载和编译外部把手模板

Load and compile external Handlebars templates?

本文关键字：外部 编译 加载      更新时间：2023-09-26

我正在尝试使用车把来为显示本地HTML文件的kiosk单元供电。这些文件使用Javascript获取远程内容，Handlebars控制模板/输出。

我想做的是将Handlebars模板保存在它们自己的目录中，当与按钮(链接)交互时-将这些模板注入页面，然后用AJAX响应填充内容。

除了模板输出之外，一切都正常了:

链接示例:

<a href="#" onclick="Kiosk.history(); return false;">History</a></li>
在application.js: 

history: function() {
    var source;
    Zepto.ajax({
      url: 'templates/history.handlebars',
      dataType: 'html',
      cache: false,
      success: function(data, status, response) {
        source = data;
        var template    = Handlebars.compile(response.responseText);
        var context = {
          title: 'Static Title (to be replaced)'
        };
        $('#main-content').html(template(context));
      }
    });

车把文件:

<div class="row" id="history">
  <div class="large-10 columns large-offset-1">
    <script id="hb-history" type="text/x-handlebars-template">
      <h2>{{ title }}</h2>
      {{ body }}
    </script>should have a template here
  </div>
</div>

我似乎错过了一些东西，因为#main-contentdiv从未与动态模板更新，只输出'应该是这里的模板'。

哦，就在我面前。

相关文章：