using HTL + Handlebars + displaying $ sign | Community
Skip to main content
jayv25585659
Level 8
June 21, 2021
Solved

using HTL + Handlebars + displaying $ sign

  • June 21, 2021
  • 2 replies
  • 1216 views

I am moving one of our in-house apps that uses Coldfusion to Adobe AEM. the pages extensively use handlebars for displaying content.

my problem is that I have this code in my HTML: ${{fees-here}}

I want to display the $ sign before the price but this causes the HTL processor/parser errors.

I am using one of 2 options at the moment:

  • remove the dollar sign
  • put a space in between $ and the curly braces (trying not to use this as horizontal space is a premium in the app)

I am hoping that there's a 3rd option so that the prices are displayed as "$344" (without any spaces in between the $ sign and the price).

Thank you!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by BrianKasingli

@jayv25585659,

Have you tried passing the dollar integer value into a handlebars helper?

// something like below.;;

 

Handlebars.registerHelper('currency', function(amount, options) { if (typeof(amount) === 'string') { amount = options.contexts[0].get(amount); } var rounded = Math.round(amount * 100); var dec = rounded % 100; var whole = rounded / 100 - dec / 100; var decStr = '' + dec; return '$' + whole + '.' + decStr + ( decStr.length < 2 ? '0' : ''); });

 

var t = Handlebars.compile("{{currency amount}}");

t({amount: 0.15});

 

 

Original post -> https://gist.github.com/kayleg/5215127

 

Checkout this other post -> https://stackoverflow.com/questions/14492098/handlebars-function-to-format-currency-with-javascript

2 replies

BrianKasingli
Community Advisor and Adobe Champion
BrianKasingliCommunity Advisor and Adobe ChampionAccepted solution
Community Advisor and Adobe Champion
June 21, 2021

@jayv25585659,

Have you tried passing the dollar integer value into a handlebars helper?

// something like below.;;

 

Handlebars.registerHelper('currency', function(amount, options) { if (typeof(amount) === 'string') { amount = options.contexts[0].get(amount); } var rounded = Math.round(amount * 100); var dec = rounded % 100; var whole = rounded / 100 - dec / 100; var decStr = '' + dec; return '$' + whole + '.' + decStr + ( decStr.length < 2 ? '0' : ''); });

 

var t = Handlebars.compile("{{currency amount}}");

t({amount: 0.15});

 

 

Original post -> https://gist.github.com/kayleg/5215127

 

Checkout this other post -> https://stackoverflow.com/questions/14492098/handlebars-function-to-format-currency-with-javascript

Nikhil-Kumar
Community Advisor
Community Advisor
June 21, 2021

@jayv25585659  - I would recommend to make use of Sling Models to manipulate any kind of data and use it in HTL then.