提问者:小点点

我如何翻译#if类型车把助手从enpe1.7到enpe-cli(2.3)


我现在在ember1.7有这个注册的车把助手。

var get = Ember.Handlebars.get;
Ember.Handlebars.registerHelper('ifCond', function(val1, val2, options) {
    var context = (options.fn.contexts && options.fn.contexts[0]) || this;
    var val1 = get(context, val1, options.fn);
    if (val1 == val2) {
        return options.fn(this);
    } else {
        return options.inverse(this);
    }
});

这个想法很简单:将第一个参数作为上下文属性,第二个参数作为实际值,并根据它们的相等性返回一个布尔值。因此,例如,如果我有一个对象用户的属性年龄,

{{#ifCond user.age "22" }}
  <h2> Twin Twos!</h2>
{{/ifCond}}

将是一个片段,当条件满足时,我将使用它来呈现h2元素。

然而,我不知道如何翻译这样一个助手为enpe-cli。

我考虑过制作一个组件,但我需要一个条件,而不是呈现一组特定DOM元素的东西。我觉得我错过了什么。我如何才能让{{#ifCond}}在Ember 2.3中工作?

编辑:我找到了一个帮助创建文档,让我实现这个:

import Ember from 'ember';

export function ifCond(params/*, hash*/) {
    return (params[0] === params[1]);
  // return params;
}

export default Ember.Helper.helper(ifCond);

但是,要使此工作,我必须编写(在模板中)

{{#if (ifCond 1 1)}}
  yep
{{/if}}

是否还有办法像我们在12月1.7中那样实际使用车把助手?


共2个答案

匿名用户

首先,没有更多的块助手:

为了支持Ember. HelperAPI,旧的Handlebar助手被删除了。这个API没有为助手提供一个获取块的机制,但是引入了对嵌套助手的支持,可以与内置助手(如{{#if}}和{{#each}})一起使用,以实现相同的目的。

建议像在示例中一样使用助手({{#if(ifCond 1)}})。如果您决定走这条路,我建议您使用enpe-truure-helers插件。使用它,您可以丢弃自己的助手并像这样使用它:

{{#if (eq user.age "22") }}
  <h2> Twin Twos!</h2>
{{/if}}

我发现真相助手非常灵活,易于理解,并建议使用它们。

或者,如果你想模拟你的旧助手,你需要为此使用一个组件,我做了一个旋转来说明你是如何做到的。

匿名用户

在调查了一段时间后,问题编辑似乎是最好的前进方式。从现在开始,这似乎是车把助手公认的方式。

要创建助手,请模拟:

import Ember from 'ember';

export function ifCond(params/*, hash*/) {
    return (params[0] === params[1]);
  // return params;
}

export default Ember.Helper.helper(ifCond);

然后,以这种格式将其包含在模板中。

{{#if (ifCond 1 1)}}
  yep
{{/if}}

这个链接为我指明了正确的方向:https://guides.emberjs.com/v2.3.0/templates/writing-helpers/

这张照片向我展示了可以做什么:http://emberigniter.com/how-to-equals-conditional-comparison-handlebars/

相关问题