I have this registered handlebars helper in ember1.7 right now.
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);
}
});
The idea is pretty simple: take first parameter as a context property, second parameter as an actual value, and return a boolean based on their equality. So, for example, if I have a property age on an object user,
{{#ifCond user.age "22" }}
<h2> Twin Twos!</h2>
{{/ifCond}}
would be a snippet I would use to render the h2 element when the condition is fulfilled.
However, I cannot figure out how to translate such a helper for ember-cli.
I've considered making a component, but I need a conditional, not something that renders a specific set of DOM elements. I feel like I'm missing something. How would I be able to make {{#ifCond}} work in Ember 2.3?
EDIT: I found a helper creation doc that let me to this implementation:
import Ember from 'ember';
export function ifCond(params/*, hash*/) {
return (params[0] === params[1]);
// return params;
}
export default Ember.Helper.helper(ifCond);
however, for this to work, I would have to write (in the template)
{{#if (ifCond 1 1)}}
yep
{{/if}}
Is there still a way to actually use the handlebar helper as we could in ember 1.7 ?
First of all there are no more block helpers:
Legacy Handlebars helpers are removed in favor of the Ember.Helper API. This API does not provide a mechanism for helpers to take a block, but does introduce support for nested helpers which can be used in concert with built-in helpers (like {{#if}} and {{#each}}) to achieve the same ends.
It is recommended to use the helpers just as you did in your example ({{#if (ifCond 1 1)}}
). If you would decide to go this route I would recommend using the ember-truth-helpers addon. Using it you can throw out your own helper and use it like this:
{{#if (eq user.age "22") }}
<h2> Twin Twos!</h2>
{{/if}}
I find the truth helpers very flexible and easy to understand and would recommend using them.
Alternatively if you want to simulate your old helper you need to use a component for that, I've made a twiddle to illustrate how you could do it.