Handlebars helper：模板渲染后如何运行代码？答案

【问题标题】：Handlebars helper: how do you run code after the template was rendered?Handlebars helper：模板渲染后如何运行代码？
【发布时间】：2016-07-27 11:36:24
【问题描述】：

我正在使用把手编写应用程序，但没有使用 Meteor 或 Ember。

我正在编写一个助手，它需要在呈现 html 后运行一些代码，以便将 onclicks 附加到一些 dom 元素。有没有办法在助手中做到这一点，而不依赖于丑陋的 setTimeout 或类似的东西？

我找到了基于 Meteor 的应用程序的解决方案，但在仅使用把手的情况下却没有。

模板：

{{#autocomplete config}}{{/autocomplete}}

助手：

Handlebars.registerHelper('autocomplete', function(config) {
  return autocompleteTemplate();
});

【问题讨论】：

你能展示一下你是如何渲染车把模板的吗？
这是您需要的信息吗？
是的，因为在此之后您可以添加绑定。
实际上，您会在其中找到渲染生成的 html 的 javascript。查看此公会以获取更多详细信息handlebarsjs.com/#getting-started
我不确定您的评论是否理解。你的意思是我应该在我的模板中添加javascript？如果可以的话，我真的很想避免这种情况。

标签： handlebars.js

【解决方案1】：

我找不到任何内置的东西可以做到这一点，所以我最终将 Handlebars.compile 包装在一个可以对渲染模板进行后处理的辅助函数中。

function compileWithExtras(template, options) {
    var template = Handlebars.compile(template, options);
    return function() {
        var rendered = template.apply(null, arguments);
        //do your post processing here
        return rendered;
    };
}

var exampleTemplate = compileWithExtras(document.getElementById("foo").innerHTML);
var postProcessedHtml = exampleTemplate(data);

如果您正在预编译模板，那么您将需要以 Handlebars.precompile 为目标，这会有点棘手，尽管可能只需要一个简单的 replace('return buffer;','return postProcess(buffer);')，例如，

    function postProcess(buffer) {
    //do your post processing here
    return buffer;        
}   

function precompileWithExtras(template, options) {
    return Handlebars.precompile(template, options)
        .replace('return buffer;','return postProcess(buffer);');
}

【讨论】：