Question

8

Format a date from inside a Handlebars Template in Meteor

rated 0 times [ 13] [ 5] / answers: 1 / hits: 75574 / 11 Years ago, mon, september 2, 2013, 12:00:00

I got a ISO formatted Date from my Data and what I actually want to do, is to modify my date format directly from my Templates.

like this:

{{format my.context.date myFormat}}

I'm using the moment library, so I could write something like this:

{{formatDate my.context.date DD.MM.YYYY HH:mm}} // 03.09.2013 18:12

It would be nice, because I think it's the place where I should be able to do this. In my template.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

terrence

Add To Favorites

Follow

Total Points: 120

Total Questions: 115

Total Answers: 87

Location: England

Member since Fri, May 22, 2020

4 Years ago

terrence questions

1 Cannot read properties of undefined (reading 'toHexString') in ether.js

Sun, Mar 13, 22, 00:00, 2 Years ago

1 Javascript Remove Focus on Enter Key Press

Sat, Jun 5, 21, 00:00, 3 Years ago

1 Implementing Lodash's debounce in a ReactJS functional component

Mon, Aug 31, 20, 00:00, 4 Years ago

1 How to customize mat select option group to allow nested values in angular

Thu, Jul 23, 20, 00:00, 4 Years ago

1 Read file component (fs.readFile)

Wed, Jun 17, 20, 00:00, 4 Years ago

View All

answered 11 Years ago gregorio · Accepted Answer

The solution is quite simple, and maybe someone will find it useful.
In most projects you have a couple of date formats you want to use.
So it's a good approach to define your formats with readable names.

For this example I took just 'short' and 'long', but you will see, it's very easy to extend.

So I created an Object in my Client Script:

var DateFormats = {

       short: "DD MMMM - YYYY",

       long: "dddd DD.MM.YYYY HH:mm"

};

Also, I created a Handlebars Helper "formatDate".

Edited: Now you should use UI instead of Handlebars

// Deprecated since version 0.8.0 

Handlebars.registerHelper("formatDate", function(datetime, format) {



// Use UI.registerHelper..

UI.registerHelper("formatDate", function(datetime, format) {

  if (moment) {

    // can use other formats like 'lll' too

    format = DateFormats[format] || format;

    return moment(datetime).format(format);

  }

  else {

    return datetime;

  }

});

As you can see, I use the moment.js lib in my Helper. To install it, just type meteor add momentjs:moment from your command line.

And now, everywhere in my Templates I can use it with the two params, like this:

{{formatDate MyISOString "short"}} // 02 September - 2013

{{formatDate MyISOString "long"}} //  Monday 02.09.2013 18:00

If you want to create your own formats, take a look at the momentjs docs http://momentjs.com/docs/