如何在HTMLBars中编写助手?

时间:2015-02-20 08:45:43

标签: javascript ember.js handlebars.js handlebarshelper htmlbars

在最新发布的EmberJS v1.9.0之后,我试图从Handlebars转移到HTMLbars。我发现非常具有挑战性的是缺乏文档。

我正在尝试实施非常简单的帮助。

例如,拿这个把手帮手:

HTML

<div id="main"></div>

<script type="text/x-handlebars" data-template-name="index">
    {{logIt test}}
    <h1>{{test}}</h1>
</script>

JS

App = Ember.Application.create({
    rootElement: '#main'
});

    App.IndexRoute = Ember.Route.extend({
        setupController: function(controller){
            controller.set('test', 'mytest');
        }
    });

    Ember.Handlebars.registerHelper("logIt", function(something) {
        console.log(something);
    });

Js Fiddle:http://jsfiddle.net/sisir/p463q2L8/

如何将其转换为htmlbars?

4 个答案:

答案 0 :(得分:4)

从Ember 1.10.0开始,这个问题通过Ember.HTMLBars.makeBoundHelper(theHelperFunction)来解决。

编辑:自Ember 1。13。6(2015年7月31日)以来,使用此标记为已弃用。

  

弃用:不推荐使用Ember.HTMLBars._registerHelper。助手(甚至是无助的)自动解决。 [弃用ID:ember-htmlbars.register-helper]

答案 1 :(得分:4)

从Ember 1.13开始,有两个API:http://emberjs.com/blog/2015/06/12/ember-1-13-0-released.html#toc_new-ember-js-helper-api

现在最简单,更常见的语法是:

mCallback.dispatchLastEvent()
  

助手接收两个参数:params是传递给助手的有序参数,hash包含键值选项,例如title =&#34; Mr。&#34;。

答案 2 :(得分:1)

我相信你可以使用 Ember.Handlebars.helper ,这是最新的emberjs guides。这个jsbin使用htmlbars并且它有效。这是 jsbin

中的帮手
AppLogItHelper = Ember.Handlebars.helper("logIt", function(something){
  console.log(something);
});

如果您使用的是 ember-cli ,它会为您自动生成一个但是使用 Ember.Handlebars.makeBoundHelper ,这在jsbin中不起作用但在我的ember-cli app。

答案 3 :(得分:0)

非常重要的新奇事物是 HTMLBars有子表达式!由于Ember 1.10+已切换到HTMLBars,您应该使用Ember.HTMLBars.makeBoundHelper而不是Ember.Handlebars.registerHelper。但您仍然可以使用Ember 1.10.1版本中的Ember.Handlebars.registerHelper

新方法:

App.XEqHelper = Ember.HTMLBars.makeBoundHelper(function(params, hash, options, env) {
    return params[0] === params[1];
    });

它从模板调用:

{{#if (x-eq order 'delivery_order')}}
    Need a delivery
{{/if}}