Is it possible to use function in Handlebars #if?
If you define your isValid
as a property
, you can use it in your if
statement without creating a custom Handlebars helper, see http://jsfiddle.net/pangratz666/Dq6ZY/:
Handlebars:
<script type="text/x-handlebars" data-template-name="obj-template" >
{{view Ember.TextField valueBinding="age" }}
{{#if isValid}}
Si Si.
{{else}}
Nope!
{{/if}}
</script>
JavaScript:
App.MyObj = Ember.Object.extend({
isValid: function() {
return this.get('age') >= 18;
}.property('age')
});
Ember.View.create({
templateName: 'obj-template',
controller: App.MyObj.create({
age: 21
})
}).append();
Handlebars if statements only compares if a value exists, to if it is a falsy value (ie non-existant, 0, an empty string etc.). You have to write a custom helper function.
You could do it like this
Handlebars.registerHelper('isValid', function (value, options) {
if (value == "valid") {
return options.fn(this);
}
return options.inverse(this);
});
This registers a block helper. If the value you pass in evaluates to "valid" it returns the template following the the helper with the current data. If it does not evaluate to valid it returns the template following the else statement with the current data.
Then in your template you could use it like this
{{#each MyApp.objController}}
{{#isValid validity}}
<some markup>
{{else}}
<some other markup>
{{/isValid}}
{{/each}}
Otherwise, if you wanted to abide by the spirit of Handlebars and do a 'logic-less' template, set a flag before you render the template indicating whether or not that data is valid, then use the handlebars if helper with the flag.
You could also possible set up a generic function to handle this and other cases. See my answer in Logical operator in a handlebars.js {{#if}} conditional for an example for a generic if (similar to the above answer)