web-dev-qa-db-ja.com

MeteorのHandlebarsテンプレート内から日付をフォーマットする

データからISO形式の日付を取得しました。実際にやりたいことは、日付形式をテンプレートから直接変更することです。

このような:

{{format my.context.date "myFormat"}}

私はモーメントライブラリを使用しているので、次のようなものを書くことができます。

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

私はこれを行うことができるはずの場所だと思うので、それはいいでしょう。私のテンプレートで。

33
Boris Kotov

解決策は非常に簡単で、おそらく誰かが役に立つでしょう。ほとんどのプロジェクトでは、使用する日付形式がいくつかあります。したがって、判読可能な名前でフォーマットを定義することは良いアプローチです。

この例では、「短い」と「長い」だけを取り上げましたが、ご覧のとおり、拡張は非常に簡単です。

そこで、クライアントスクリプトでオブジェクトを作成しました。

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

また、Handlebarsヘルパー「formatDate」を作成しました。

編集済み:ハンドルバーの代わりにUIを使用する必要があります

// 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;
  }
});

ご覧のとおり、ヘルパーでmoment.jsライブラリを使用しています。インストールするには、meteor add momentjs:momentコマンドラインから。

そして今、私のテンプレートのどこでも、次のように2つのパラメータでそれを使用できます:

{{formatDate MyISOString "short"}} // 02 September - 2013
{{formatDate MyISOString "long"}} //  Monday 02.09.2013 18:00

独自の形式を作成する場合は、momentjsのドキュメントをご覧ください http://momentjs.com/docs/

ハッピーコーディング!

90
Boris Kotov