【问题标题】:Custom Handlebars helper is not resolved without parameters自定义 Handlebars 助手在没有参数的情况下无法解析
【发布时间】:2014-09-26 21:19:29
【问题描述】:

我正在创建一个车把助手,它采用以下形式:

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 应用程序的一部分。在模板中,helper 是这样调用的:

{{#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}}

我正在使用车把 v1.0.0。这是 2.0.0 中解决的问题吗?这不是障碍,但如果可能的话,我显然不希望使用虚拟参数。

【问题讨论】:

    标签: javascript backbone.js requirejs handlebars.js


    【解决方案1】:

    这里是fiddle,您需要帮助。使用了车把-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;
    }); 
    

    希望对你有所帮助。

    【讨论】:

      猜你喜欢
      • 2013-08-03
      • 2016-12-04
      • 2013-06-27
      • 2018-02-14
      • 2023-03-30
      • 2018-05-14
      • 1970-01-01
      • 1970-01-01
      • 2016-08-11
      相关资源
      最近更新 更多