HandlebarsHelpers
Jump to navigation
Jump to search
Helpers have to be defined before you call them
<script id="content" type="text/x-hanglebars-template">
{{makeLink "Text for Link" "http://www.outwater.com"}}
</script>
JavaScript
Handlebars.registerHelper("makeLink", function(text, url){
text= Handlebars.Utils.escapeExpression(text);
url = Handlebars.Utils.escapeExpression(url);
var theLink = '<a href=" + url + '">' + text + '</a>';
return new Handlebars.SafeString(theLink);
// SafeString does not escape return
});
Passing Options
// css
<style>
.redText{color:red}
.blueText{color:blue}
.greenText{color:green}
</style>
{{changeColor "make my text red" color="blue"}}
JavaScript
Handlebars.registerHelper("changeColor", function(text, options){
text = Handlebars.Utils.escapeExpression(text);
if(options.hash.color === 'red'){
return new Handlebars.SafeString("<span class='redText'>"+ text + "</span>");
else if(options.hash.color === 'blue'){
return new Handlebars.SafeString("<span class='blueText'>"+ text + "</span>");
}else{
return new Handlebars.SafeString("<span class='greenText'>"+ text + "</span>");
}
}
});
Passing options that are available to all helper function you create
{{sayhello}}
JavaScript
Handlebars.registerHelper("sayHello", function(options){
switch(options.data.lang){
}
})