Reputation: 41
How to use handlebars.js
helpers in SC? The documentation mentions these custom helpers, but doesn't say how to use them. I also didn't find the HandlebarsExtras
file. Is there any documentation?
Upvotes: 0
Views: 74
Reputation: 26
Handlebars is used in the templates in SuiteCommerce, and the helpers usually have the following format.
{{helperFunctionName 'variable'}}
For translations, you call the "translate" function and send the string as a parameter; see below.
<button type="submit" class="login-register-login-submit" data-action="login-button">
{{translate 'Sign In'}}
</button>
In the menu, you have an "objectToAttributes" function that processes links and other properties.
{{#each categories}}
<li>
<a class="{{class}}" {{objectToAtrributes this}}>{{translate text}}</a>
</li>
{{/each}}
An example of the output after compiling the above menu item would be:
<li>
<a class="header-menu-level2-anchor" href="/medical-waste-recovery" id="" data-touchpoint="home" data-hashtag="medical-waste-recovery">Medical Waste</a>
</li>
Some other functions such as "formatCurrency" are usually used in the javascript files, in the getContext function, where you process the data before passing that information over to the template.
getContext: function() {
const { model } = this.wizard;
const currency = model.getCurrency();
if (currency) {
this.currencySymbol = currency.symbol;
}
return {
// @property {String} creditTotalFormatted
creditTotalFormatted: Utils.formatCurrency(
model.get('credits_total'),
this.currencySymbol
)
};
}
Upvotes: 0