如果没有参数,则无法解析自定义手柄辅助对象

时间:2014-09-26 21:19:29

标签: javascript backbone.js requirejs handlebars.js

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

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

我使用了把手v1.0.0。这是2.0.0中解决的问题吗?这不是阻止者,但如果可能,我显然不希望使用伪参数。

1 个答案:

答案 0 :(得分:1)

这是fiddle您需要的助手。车把-1.0.rc.1使用。也尝试使用车把 - 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;
}); 

希望它有所帮助。