如何将 #if 类型车把助手从 ember 1.7 转换为 ember-cli (2.3)答案

【问题标题】：How do I translate #if type handlebars helpers from ember 1.7 to ember-cli (2.3)如何将 #if 类型车把助手从 ember 1.7 转换为 ember-cli (2.3)
【发布时间】：2016-01-27 19:52:43
【问题描述】：

我现在在 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}}

将是一个 sn-p，当条件满足时，我将使用它来渲染 h2 元素。

但是，我不知道如何为 ember-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}}

还有没有办法像我们在 ember 1.7 中那样实际使用车把助手？

【问题讨论】：

将此作为评论发布，因为它不是直接答案，但我建议给ember-truth-helpers 看看。非常有用且可靠的插件。
经过更多调查后，如果您不想引入额外的依赖项，则编辑后的答案是最好的方法。
非常感谢您的调查。从我自己的调查来看，这似乎是……公认的车把助手的“经典”演变。我会将其更新为正确答案。

标签： ember.js ember-cli

【解决方案1】：

首先有no more block helpers:

Legacy Handlebars 助手被移除，取而代之的是 Ember.Helper API。此 API 不提供帮助者获取块，但确实引入了对可以使用的嵌套助手的支持与内置助手（如 {{#if}} 和 {{#each}}）一起达到同样的目的。

建议像您在示例中所做的那样使用帮助程序 ({{#if (ifCond 1 1)}})。如果您决定走这条路，我建议您使用ember-truth-helpers 插件。使用它你可以扔掉你自己的助手并像这样使用它：

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

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

或者，如果您想模拟您的旧助手，您需要为此使用一个组件，我有 made a twiddle 来说明您如何做到这一点。

【讨论】：

啊。有趣的。 Ember-truth-helpers 肯定有帮助，但这个答案也提供了关于如何使用组件返回值的奖励。

【解决方案2】：

经过一段时间的挖掘，似乎问题编辑是最好的前进方式。从现在开始，这似乎是车把助手的公认方式。

要创建帮助器，请模拟：

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/

【讨论】：