javascript - 自定义 Handlebars 助手在没有参数的情况下无法解析

Question

我正在创建一个 Handlebars 助手，其形式如下:

define(['Handlebars'], function (Handlebars) {
    Handlebars.registerHelper("myHelper", function (options) {
        console.log('myHelper');
        if (*condition*) {
            console.log('myHelper False');
            return options.inverse(this);
        } else {
            console.log('myHelper True');
            return options.fn(this);
        }
    });
});

如您所见，我正在使用 require.js。我还将其用作 Backbone.js 应用程序的一部分。在模板中，助手的调用方式如下:

{{#myHelper}}
<!-- Some HTML -->
{{else}}
<!-- Some HTML -->
{{/myHelper}}

但是，帮助程序总是返回 false，因为它无法被识别。我知道这一点是因为 console.log 从未被调用。我的应用程序中有其他可以工作的自定义助手，但它们都接受参数。如果我添加一个虚拟参数，则帮助器可以正常工作:

define(['Handlebars'], function (Handlebars) {
    Handlebars.registerHelper("myHelper", function (dummy, options) {
        console.log('myHelper');
        if (*condition*) {
            console.log('myHelper False');
            return options.inverse(this);
        } else {
            console.log('myHelper True');
            return options.fn(this);
        }
    });
});

模板:

{{#myHelper "string"}}
<!-- Some HTML -->
{{else}}
<!-- Some HTML -->
{{/myHelper}}

我使用的是 Handlebars v1.0.0。这是 2.0.0 中解决的问题吗？这不是阻碍，但如果可能的话，我显然不希望使用虚拟参数。

Answer 1

这里是fiddle与您需要的帮助者一起。使用了handlebars-1.0.rc.1。还尝试使用handlebars-1.3.0 - 效果很好。

HTML

<script id="topLevel" type="text/x-handlebars-template">
    {{#myHelper}}
        it's truthy
    {{else}}
        it's falsy
    {{/myHelper}}
</script>

JS

Handlebars.registerHelper('myHelper', function (options) {
    if (true) {
        console.log("It's true");
        return options.fn(this);
    }
    console.log("It's false");
    return options.inverse(this);
});

var _template =  Handlebars.compile($('#topLevel').html());
$('body').append(_template());

所以您的问题可能会发生:

过时的库或者您在注册之前尝试使用帮助程序。 Require.js 异步加载库/文件，调用句柄作为依赖项。示例:

define(function(require){
    var yourObj = function() {
      require(['handlebars'], function (Handlebars) {
      // use Handlebars here
      });
    };
    return yourObj;
}); 

希望对你有帮助。