1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Firestoreから取得したtimestampをAngularで日付に変換しようとする場合

Last updated at Posted at 2021-10-14

自分が結構2時間ほど苦労した部分だったので、同じように悩んでいる方にも役に立てればと思いメモして置きました。

正解ではないかも知らないですが、一応実行はできるようになりましたので、あくまでも参考程度にしておけばと思います。

#背景

同じ日付変数を:

  • Firestoreでの日付タイプはtimestampの形で保存されている
  • AngularではDateタイプで定義されている

AngularからFirestoreに保存する時は、そのままDateタイプで送ってもFirestoreで対応してくれてるので問題ないですが、

Firestoreから取得した時には、Date関連関数使ってもうまくいけませんでした。

エラーメッセージとしては、関数がないよとかコンパイル時点でエラーになったりなどしました。

#解決方法

解決は意外と簡単でした。(正解とは言えないですが)

      let timestamp = <any>from_firestore.deliveryDate;

       // 場合によっては直接Dateタイプで帰ってくる場合もあるので判断をする
      // Dateタイプなのか判断して処理を区分する
      if (timestamp instanceof Date) {
        d = timestamp; // Dateタイプであればそのまま使う
      } else {
        // Dateタイプでない場合は、toDate()で変換をかける
        let date = <any>timestamp;
        d = date.toDate();
      }
      this.deliveryDate.year = d.getFullYear();
      this.deliveryDate.month = d.getMonth() + 1; // 0からスタートなので
      this.deliveryDate.day = d.getDate(); // 注意getDayは曜日を取得、間違いないように

このように、一旦Firestoreから取得した日付データを で強制的にanyタイプにして置きます。(これをしないと次の行で、toDate()がエラーになってしまいます)

そして、toDate()で日付タイプに変換すると、通常通りjavascriptのDateタイプ関数で内容を取得することができるようになります。

お願い

正解ではないですが、一応困った時の解決策にはなりましたので紹介します。もし正しい方法を知っているかたいましたらご指摘よろしくお願いいたします。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?