Menu
Handlebars supports {{else if}} blocks as of 3.0. 0. is the point in not having an elsif (or else if) in handlebars that you are putting too much logic into your template.
You can use the unless helper as the inverse of the if helper. Its block will be rendered if the expression returns a falsy value. If looking up license under the current context returns a falsy value, Handlebars will render the warning. Otherwise, it will render nothing.
Helpers can be used to implement functionality that is not part of the Handlebars language itself. A helper can be registered at runtime via Handlebars. registerHelper , for example in order to uppercase all characters of a string.
To iterate over an object with JavaScript and Handlebars. js, we can use the #each keyword. to add the Handlebars script and the template for looping through each entry in data . We use #each this to loop through each array property.
Handlebars supports {{else if}} blocks as of 3.0.0.
Handlebars v3.0.0 or greater:
{{#if FriendStatus.IsFriend}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div>
{{else if FriendStatus.FriendRequested}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div>
{{else}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div>
{{/if}}
Prior to Handlebars v3.0.0, however, you will have to either define a helper that handles the branching logic or nest if statements manually:
{{#if FriendStatus.IsFriend}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div>
{{else}}
{{#if FriendStatus.FriendRequested}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div>
{{else}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div>
{{/if}}
{{/if}}
I usually use this form:
{{#if FriendStatus.IsFriend}}
...
{{else}} {{#if FriendStatus.FriendRequested}}
...
{{else}}
...
{{/if}}{{/if}}
Handlebars now supports {{else if}} as of 3.0.0.
Therefore, your code should now work.
You can see an example under "conditionals" (slightly revised here with an added {{else}}:
{{#if isActive}}
<img src="star.gif" alt="Active">
{{else if isInactive}}
<img src="cry.gif" alt="Inactive">
{{else}}
<img src="default.gif" alt="default">
{{/if}}
http://handlebarsjs.com/block_helpers.html
The spirit of handlebars is that it is "logicless". Sometimes this makes us feel like we are fighting with it, and sometimes we end up with ugly nested if/else logic. You could write a helper; many people augment handlebars with a "better" conditional operator or believe that it should be part of the core. I think, though, that instead of this,
{{#if FriendStatus.IsFriend}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div>
{{else}}
{{#if FriendStatus.FriendRequested}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div>
{{else}}
<div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div>
{{/if}}
{{/if}}
you might want to arrange things in your model so that you can have this,
{{#if is_friend }}
<div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div>
{{/if}}
{{#if is_not_friend_yet }}
<div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div>
{{/if}}
{{#if will_never_be_my_friend }}
<div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div>
{{/if}}
Just make sure that only one of these flags is ever true. Chances are, if you are using this if/elsif/else in your view, you are probably using it somewhere else too, so these variables might not end up being superfluous.
Keep it lean.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With