ビューファイルでの日時のフォーマット

ビューファイルでの日時のフォーマット

ビューファイルでの日時のフォーマット形式について、備忘録としてこちらにまとめます。

下記のようになっています。

[db/schema.rb]

  create_table "cooking_memories", options: "ENGINE=InnoDB DEFAULT CHARSET=utf8mb4", force: :cascade do |t|
    t.string "cooking_name", null: false
    t.string "fish_name", null: false
    t.date "cooking_date"
    t.text "memo"
    t.bigint "user_id", null: false
    t.datetime "created_at", precision: 6, null: false
    t.datetime "updated_at", precision: 6, null: false
    t.index ["user_id"], name: "index_cooking_memories_on_user_id"
  end
[1] pry(main)> cooking_memory = CookingMemory.last
  CookingMemory Load (2.2ms)  SELECT `cooking_memories`.* FROM `cooking_memories` ORDER BY `cooking_memories`.`id` DESC LIMIT 1
=> #<CookingMemory:0x00007fefe7b7e060
 id: 25,
 cooking_name: "アジフライ",
 fish_name: "アジ",
 cooking_date: Fri, 06 May 2022,
 memo: "アジフライを作りました。",
 user_id: 1,
 created_at: Fri, 06 May 2022 01:19:57 JST +09:00,
 updated_at: Fri, 06 May 2022 01:19:57 JST +09:00>
[2] pry(main)> cooking_memory.cooking_date
=> Fri, 06 May 2022
[ビューファイル]

= l cooking_memory.cooking_date
[config/locales/activerecord/ja.yml]

ja:
  activerecord:
    models:
      cooking: '料理'
      fish: '魚'
      handle: '捌き方'
      user: '会員者'
    attributes:
      cooking:
        name: '料理'
      fish:
        kind: '魚の種類'
      handle:
        pattern: '捌き方'
      user:
        name: 'ニックネーム'
        email: 'Eメール'
        password: 'パスワード'
        password_confirmation: 'パスワード再確認'
      cooking_memory:
        cooking_name: '料理名'
        fish_name: '魚の種類'
        cooking_date: '調理をした日'
        cooking_memory_image: '料理の画像'
        memo: 'メモ欄'
  time:
    formats:
      default: '%Y年%m月%d日'

ブラウザには、以下のように表示されています。

Image from Gyazo

指定しているフォーマットとは、別なフォーマットで表示されてしまいます。。。

ビューファイルをstrftimeメソッドを使って以下のようにすると指定した通りのフォーマットで表示されます。

[ビューファイル]

= cooking_memory.cooking_date.strftime("%Y年%m月%d日")

Image from Gyazo

下記のように翻訳ファイルを書き換えたところ、ビューファイルでlメソッドを使っても指定した通りの日時のフォーマットになりました。

[config/locales/activerecord/ja.yml]

ja:
  activerecord:
    models:
      cooking: '料理'
      fish: '魚'
      handle: '捌き方'
      user: '会員者'
    attributes:
      cooking:
        name: '料理'
      fish:
        kind: '魚の種類'
      handle:
        pattern: '捌き方'
      user:
        name: 'ニックネーム'
        email: 'Eメール'
        password: 'パスワード'
        password_confirmation: 'パスワード再確認'
      cooking_memory:
        cooking_name: '料理名'
        fish_name: '魚の種類'
        cooking_date: '調理をした日'
        cooking_memory_image: '料理の画像'
        memo: 'メモ欄'
  date:
    formats:
      default: '%Y年%m月%d日'

Image from Gyazo

※ポイント
そもそもlメソッドと翻訳ファイルの記述の仕方の認識が曖昧だったため、こちらにまとめます。

lメソッドは、localizeメソッドの略で、DateオブジェクトやTimeオブジェクトをconfig/locales/以下の翻訳ファイルに設定した日時のフォーマットに変換することができる。

翻訳ファイルは、記述の仕方が決まっていて日時の場合は、以下のようになる。

ja:
  date:
    formats:
      default: "%Y/%m/%d"
      long: "%Y年%m月%d日"
      short: "%m/%d"
  time:
    formats:
      default: "%y/%m/%d %H:%M"

翻訳ファイルのdate以下は、Dateオブジェクトの時に読み込まれる。
翻訳ファイルのtime以下は、Timeオブジェクトの時に読み込まれる。
lメソッドを使う際に第二引数を指定しないとdefault部分が読み込まれる。
lメソッドを使う際に第二引数を指定すると、default以外の部分が使える。(以下が使い方の例)

[1] pry(main)> I18n.l(Date.today, format: :long)
=> "2022年05月06日"

参考記事

Rails で date型カラムの view 表記を l メソッドのオプションで変更する - Just do IT

【Rails】 I18n入門書~日本語化対応の手順と応用的な使い方 | Pikawaka