【问题标题】:How to use templates via Handlebars.precompile (vs CLI)如何通过 Handlebars.precompile (vs CLI) 使用模板
【发布时间】:2014-05-29 18:49:18
【问题描述】:

我在无法使用 Node.js 的 .NET 环境中(要求,愚蠢的事情)。我们有一个自定义的 Backbone 应用程序,并且正在将 Handlebars 用于客户端模板。由于本项目的限制,我们使用 Handlebars.precompile 手动预编译所有模板。我已经完成了一些 google-fu 并通过 Stackoverflow 进行了搜索,但在 Handlebars.precompile 上没有看到太多有用的文档(由此产生的输出与使用 CLI 工具不同)。我的问题是:一旦我以编程方式预编译 Handlebars 模板,它们将如何使用?此实现不会将它们添加到 Handlebars.templates 命名空间。

例如,我们将采用一个基本模板(称为 Stuff.handlebars):

{{!-- begin template --}}
    <strong> {{test}} </strong>
{{!-- end template --}}

这是使用Handlebars.precompile 的输出:

function (Handlebars, depth0, helpers, partials, data) {
    this.compilerInfo = [4, '>= 1.0.0'];
    helpers = this.merge(helpers, Handlebars.helpers);
    data = data || {};
    var buffer = "",
        stack1, helper, functionType = "function",
        escapeExpression = this.escapeExpression;


    buffer += "<strong> ";
    if (helper = helpers.test) {
        stack1 = helper.call(depth0, {
            hash: {},
            data: data
        });
    } else {
        helper = (depth0 && depth0.test);
        stack1 = typeof helper === functionType ? helper.call(depth0, {
            hash: {},
            data: data
        }) : helper;
    }
    buffer += escapeExpression(stack1) + " </strong>";
    return buffer;
}

通过node.js车把编译器(handlebars stuff.handlebars -f test.js)运行时,输出如下:

(function () {
    var template = Handlebars.template,
        templates = Handlebars.templates = Handlebars.templates || {};
    templates['stuff'] = template({
        "compiler": [5, ">= 2.0.0"],
        "main": function (depth0, helpers, partials, data) {
            var helper, functionType = "function",
                escapeExpression = this.escapeExpression;
            return "\r\n    <strong> " + escapeExpression(((helper = helpers.test || (depth0 && depth0.test)), (typeof helper === functionType ? helper.call(depth0, {
                "name": "test",
                "hash": {},
                "data": data
            }) : helper))) + " </strong>\r\n";
        },
        "useData": true
    });
})();

我的问题是:我如何适当地使用以编程方式创建的 Handlebars 模板并将数据传递给它们?我目前将它们命名为App.Templates.mytemplatename = ...output of handlebars.precompile(source)... ?

所以,比如设置一个模板我是:

var foo = $("#foo");
$(foo).html(Handlebars.template(App.Templates.Stuff));

这会正确输出减数据。我如何将数据传递给这个?

请记住,我仅在尝试传递数据的页面上使用 handlebars.runtime.js 库(否则我不会执行所有这些步骤)。

编辑:好的,我找到了答案。

使用上面的示例,我创建了一个名为“testObj”的对象:

testObj = { test: "foo bar" };

接下来,我将 Handlebars.template() 调用分配给一个变量:

var template = Handlebars.template(App.Template.Stuff);

最后,我将对象作为参数传入:

template(testObj);

其输出为:"foo bar"

【问题讨论】:

  • 我正在处理一些不同但相似的事情。很高兴在这里找到这个!

标签: javascript handlebars.js precompile


【解决方案1】:

使用上面的示例,我创建了一个名为“testObj”的对象:

testObj = { test: "foo bar" };

接下来,我将 Handlebars.template() 调用分配给一个变量:

var template = Handlebars.template(App.Template.Stuff);

最后,我将对象作为参数传入:

template(testObj);

其输出为:"foo bar"

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-04-29
    • 1970-01-01
    • 2018-01-01
    • 2018-02-21
    • 1970-01-01
    • 1970-01-01
    • 2020-07-13
    相关资源
    最近更新 更多