Add handlebar helpers in ember cli project

10:56 Anil Maurya 0 Comments

Updated for ember-cli 1.13.8

To add handlebar helper, create file under 'app/helpers/' directory

If your helper name is 'if-first' than your file will be like 'app/helpers/if-first.js'

Remember to use dash in helper name so that it will be loaded automatically, for more info read http://www.ember-cli.com/#resolving-handlebars-helpers .


Example:

Check for first element in each loop.

'app/helpers/if-first.js'

import Ember from "ember"
export default Ember.Helper.helper(function(options)  {
 if(options[0] === 0){
    return options[1];
  }else{
    return options[2];
  }
};    


then use it in your handlebars template

{{#each items as |item index|}} 
<div class={{if-first index "active item" "item"}}>
           </div>
{{/each}}  

You can also pass  parameter to helpers like:

 {{#format-date date}}

 and collect parameter:

 export default Ember.Helper.helper(function(date) {
    return moment(date[0]).fromNow();
});

  

0 comments :