把手 - 渲染服务器和客户端与相同的模板

Question

我有以下车把模板需要以两种方式使用。第一种是在页面加载时渲染初始服务器端内容。第二种是在用户单击CTA以获取更多内容时向页面呈现其他内容。

在使用AJAX使用把手的在线教程后，我使用<script>标签包装了text/x-handlebars-template类型的模板。这是模板：

<script id="my-unique-id" type="text/x-handlebars-template">
    <div class="element">
        \{{name}}
    </div>
</script>

这里的问题是我需要使用\转义大括号，以便在<script>标记中使用我的模板。此模板适用于ajax请求。这是一个示例请求，我将使用脚本ID来呈现从API返回的内容：

$.ajax({
  dataType: "json",
  data: data,
  url: url, 
  success: function(response) {
    var Handlebars = window.Handlebars;
    var templateId = '#my-unique-id';
    for(var i = 0; i < response.items.length; i++) {

      var template = Handlebars.compile($(templateId).html());   

      $('.some-parent-container').append('<div>' + template(response.Articles[i]) + '</div>');
    }
  }
});

但是当我尝试在服务器上渲染相同的模板时它不会渲染，因为它在脚本标记内，我也相信使用\来逃避模板中的花括号只能运行客户端一边而不是服务器端。

是否有人建议使用能够在客户端和服务器端呈现模板而不必复制模板文件的模板的正确方法？