Question

我正在使用把手从部分编译模板。目前，我有以下javascript：

var handlebars = require('handlebars'),
  fs = require('fs');

var data = {
  title: "Print handlebars tempalte",
  author: "Internet",
  body: "Hi, I am the body"
}

fs.readFile('partial.html', 'utf-8', function(error, source) {
  handlebars.registerPartial('example_partial', source);
});

fs.readFile('ignore-keywords.html', 'utf-8', function(error, source) {
  var template = handlebars.compile(source);
  var html = template(data);
  console.log(html)
});

部分如下

<div>
  <p>
    Hi, I am a partial!
  </p>
</div>

模板是

<div class="header">
    <h1>{{title}}</h1>
</div>
<div class="body">
    <p>{{body}}</p>
</div>
<div class="footer">
    <div>
      <p>
        Written by {{author}}
      </p>
    </div>
    {{> example_partial}}
</div>

正如您在脚本中看到的，我可以使用console.log打印最终生成的html。但是，我希望能够在没有填写数据的情况下打印最终模板。这样的事情：

<div class="header">
    <h1>{{title}}</h1>
</div>
<div class="body">
    <p>{{body}}</p>
</div>
<div class="footer">
    <div>
      <p>
        Written by {{author}}
      </p>
    </div>
    <div>
      <p>
        Hi, I am a partial!
      </p>
    </div>
</div>

我希望能够打印已编译的模板，然后我可以将其发送到使用此编译模板的其他源，将其填入数据，然后生成相应的HTML。为此，我需要生成上述模板。我将如何实现这一目标？

Answer 1

您无法打印或共享已编译的模板，因为它们是函数。

当你调用handlebars.compile时，它会将模板分解为字符串和替换标记，然后在运行时构建一个函数，该函数将字符串与来自传入数据的正确标记连接起来。循环（{{#each}}）也变成了真正的JS循环。

不幸的是，简单的JSON字符串算法和更健壮的structured cloning algorithm都不能序列化函数对象。虽然有些浏览器确实支持打印源的函数.toString，但我不知道任何可能的事情。

我认为你可能能够解决这个问题。我会尝试替换{{模板中的'ignore-keywords.html'令牌，以便它们不会被手柄评估，但会排除{{>令牌。对部分模板执行相同操作，然后调用父模板。它应该评估并包含部分而不替换任何变量。将转义的令牌交换回{{并且您有一个可以正常编译的模板，但已经有部分内联。

Answer 2

由于Handlebars是JS，您需要向每个项目/站点/应用程序添加一个JS文件，该文件具有全局可访问的功能，可以从静态位置（已知的Web地址）检索模板，然后根据功能生成所述模板参数。或者使用Node.js之类的东西构建并根据ajax请求参数返回这些模板服务器端。就个人而言，我会坚持使用前者，因为它只需要在任何你想要的应用程序中嵌入一个JS文件。

打印已编译的车把模板（未填写数据）

2 个答案: