angular - Angular / Firestore - AngularFirestoreDocument の操作

Question

私が使っているもの

• 角度
• ファイアストア

私が達成しようとしていること

• 文書データの操作

• 返された日付を読み取り可能なものに変換します

私が持っているもの

• マップされたデータを返すためにsnapshotChangesを使用するアルバムのリストがあります

• AngularFirestorDocumentのアルバムがあります

質問

• アルバム リスト コンポーネントと同じように、アルバム コンポーネントで返された日付を操作するにはどうすればよいですか?

アルバム一覧

したがって、このコンポーネントはアルバムのリストを正しく返します。返す前に日付を操作して、HTML が正しい形式で表示されるようにします。

export class AlbumsListCompoment implements OnInit {

  private albumCollection: AngularFirestoreCollection<any>;
  albumns: Observable<any[]>;
  folderId: string;

  constructor(
    private readonly afs: AngularFirestore,
    private activatedRoute: ActivatedRoute,
    private router: Router
  ) {

    // Look at the url for the Folder ID and set the local variable
    this.activatedRoute.params.forEach((urlParameters) => {
      this.folderId = urlParameters['folderId'];
    });

    // Album Reference "folders/folderid/albums"
    this.albumCollection = afs.collection<any>(`folders/${this.folderId}/albums`);

    // Get the data
    this.albumns = this.albumCollection.snapshotChanges().map(actions => {
      return actions.map(a => {

        const data = a.payload.doc.data();

        // Get the date from each album
        var albumDateTimeStapm = data.album_date;

        // Convert the unix value and format it based on the users locale setting
        var albumDateISO = moment(albumDateTimeStapm).format("DD/MM/YYYY");

        // Create a new 'name' to use in the HTML binding
        data.formattedDate = albumDateISO;

        const id = a.payload.doc.id;
        return { id, ...data };
        });
       });
      }

  ngOnInit() {

  }

  }

アルバム

このコンポーネントにアプローチして同じ操作を実行する方法を完全には示していません。リストではなく、単一のドキュメント/アルバムです。

export class AlbumDetails implements OnInit {

  folderId: string;
  albumId: string;

  private albumDoc: AngularFirestoreDocument<any>;
  album: Observable<any>;

  constructor(
    private readonly afs: AngularFirestore,
    private activatedRoute: ActivatedRoute,
    private router: Router) {

    // Look at the url for the Folder and Album ID and set the local variable
    this.activatedRoute.params.forEach((urlParameters) => {
      this.folderId = urlParameters['folderId'];
      this.albumId = urlParameters['albumId'];
    });

    this.albumDoc = afs.doc<any>(`folders/${this.folderId}/albums/${this.albumId}`);
    this.album = this.albumDoc.valueChanges();


  }

  ngOnInit() {}

}

どんな助けでも大歓迎です:)