using HTL + Handlebars + displaying $ sign

Avatar

Avatar
Validate 25
Level 4
jayv25585659
Level 4

Likes

46 likes

Total Posts

131 posts

Correct reply

0 solutions
Top badges earned
Validate 25
Validate 10
Validate 1
Contributor 2
Ignite 5
View profile

Avatar
Validate 25
Level 4
jayv25585659
Level 4

Likes

46 likes

Total Posts

131 posts

Correct reply

0 solutions
Top badges earned
Validate 25
Validate 10
Validate 1
Contributor 2
Ignite 5
View profile
jayv25585659
Level 4

20-06-2021

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!

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Establish
MVP
BrianKasingli
MVP

Likes

644 likes

Total Posts

606 posts

Correct reply

239 solutions
Top badges earned
Establish
Ignite 1
Give Back 5
Give Back 3
Give Back 10
View profile

Avatar
Establish
MVP
BrianKasingli
MVP

Likes

644 likes

Total Posts

606 posts

Correct reply

239 solutions
Top badges earned
Establish
Ignite 1
Give Back 5
Give Back 3
Give Back 10
View profile
BrianKasingli
MVP

21-06-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

Answers (1)

Answers (1)

Avatar

Avatar
Boost 250
MVP
Nikhil-Kumar
MVP

Likes

251 likes

Total Posts

262 posts

Correct reply

38 solutions
Top badges earned
Boost 250
Validate 1
Ignite 3
Ignite 1
Give Back 5
View profile

Avatar
Boost 250
MVP
Nikhil-Kumar
MVP

Likes

251 likes

Total Posts

262 posts

Correct reply

38 solutions
Top badges earned
Boost 250
Validate 1
Ignite 3
Ignite 1
Give Back 5
View profile
Nikhil-Kumar
MVP

21-06-2021

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