从Meteor中的Handlebars模板内部格式化日期

时间:2021-10-03 16:26:01

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.

我从我的数据中获得了ISO格式的日期以及我实际想要做的是直接从我的模板修改我的日期格式。

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.

这会很好,因为我认为这是我应该能够做到这一点的地方。在我的模板中。

1 个解决方案

#1


85  

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:

所以我在客户端脚本中创建了一个Object:

var DateFormats = {
       short: "DD MMMM - YYYY",
       long: "dddd DD.MM.YYYY HH:mm"
};

Also, I created a Handlebars Helper "formatDate".

另外,我创建了一个Handlebars Helper“formatDate”。

Edited: Now you should use UI instead of Handlebars

编辑:现在你应该使用UI而不是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.

如您所见,我在Helper中使用了moment.js lib。要安装它,只需从命令行键入meteor add momentjs:moment。

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/

如果您想创建自己的格式,请查看momentjs docs http://momentjs.com/docs/

Happy coding!

#1


85  

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:

所以我在客户端脚本中创建了一个Object:

var DateFormats = {
       short: "DD MMMM - YYYY",
       long: "dddd DD.MM.YYYY HH:mm"
};

Also, I created a Handlebars Helper "formatDate".

另外,我创建了一个Handlebars Helper“formatDate”。

Edited: Now you should use UI instead of Handlebars

编辑:现在你应该使用UI而不是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.

如您所见,我在Helper中使用了moment.js lib。要安装它,只需从命令行键入meteor add momentjs:moment。

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/

如果您想创建自己的格式,请查看momentjs docs http://momentjs.com/docs/

Happy coding!