Registering a new Template helper


#1

I’m quite new into Framework7 world, so please accept my appologies for the simple question, but - how do I register and compile a new Template helper?
I’d like to format a date differently in a Component, inside {{each}} section and as far as I understand, the only way to accomplish this, is to create a new helper, however - I’m finding it hard to understand the way of doing that. Should I define it in my app.js or on that particular Component page?

Thank you in advance!


#2

http://framework7.io/kitchen-sink/
console:

var $$=Dom7;
var obj={
  tmpl:'<div class="list">\
          <ul>\
            {{#this}}\
            <li>\
              <div class="item-content">\
                <div class="item-inner">\
                  <div class="item-title">{{reverse name}}</div>\
                  <div class="item-after">{{multiply id}}</div>\
                </div>\
              </div>\
            </li>\
            {{/this}}\
          </ul>\
        </div>',
  data:[
    {id:'1',name:'ok'},
    {id:'2',name:'ok'},
    {id:'3',name:'ok'}
  ],
  helpers:function(){
    Template7.registerHelper('reverse',function(val){
      return val.split("").reverse().join("");
    });
    Template7.registerHelper('multiply',function(val){
      return Number(val)*2;
    });
  }(),
  init:function(){
    $$('.page-content').html(Template7.compile(this.tmpl)(this.data));
  }
};
obj.init();

#3

Thanks for the reply!

I, however, still am a bit confused - should I put that on the main app.js file or on the particular .html page, where handlebars are placed?
In addition - I do need to compile only the function, since data and template is passed already on the Routes level, so how should I proceed in this case?


#4

app.js
and only once


#5
var app=new Framework7({params});

Template7.registerHelper('reverse',function(val){
  return val.split("").reverse().join("");
});

Template7.registerHelper('multiply',function(val){
  return Number(val)*2;
});

#6

This helped, thanks a lot!