AngularFireStore-操作AngularFireStore文档

我正在使用的内容

• 棱角的
• 火库

我正在努力实现的目标

• 操作文档数据

• 将返回的日期转换为可读的内容

我拥有的

• 我有一个相册列表，我在其中使用快照更改返回映射数据

• 我有一张专辑，它是一个AngularFirestorDocument

问题

• 如何在相册组件中以与在相册列表组件中相同的方式处理返回的日期

专辑列表

因此，这个组件可以正确地返回相册列表，并且我可以在返回日期之前对其进行操作，以便HTML显示正确的格式

导出类AlbumsListComponent实现OnInit{
私人专辑收藏：AngularFirestoreCollection；
蛋白：可见；
folderId：字符串；
建造师(
私人只读afs:AngularFirestore，
私有激活路由：激活路由，
专用路由器
) {
//查看文件夹ID的url并设置局部变量
this.activatedRoute.params.forEach（（urlParameters）=>{
this.folderId=urlParameters['folderId']；
});
//相册参考“文件夹/文件夹ID/相册”
this.albumCollection=afs.collection（`folders/${this.folderId}/albums`）；
//获取数据
this.albumns=this.albumCollection.snapshotChanges（）.map（操作=>{
返回actions.map（a=>{
const data=a.payload.doc.data（）；
//从每张相册中获取日期
var albumDateTimeStapm=data.album\u日期；
//转换unix值并根据用户区域设置对其进行格式化
var albumDateISO=时刻（albumDateTimeStapm）.format（“DD/MM/yyyyy”）；
//创建要在HTML绑定中使用的新“名称”
data.formattedDate=albumDateISO；
const id=a.payload.doc.id；
返回{id，…data}；
});
});
}
恩戈尼尼特（）{
}
}

专辑

我并不完全展示如何接近这个组件来执行相同的操作。它不是一个列表，而是一个单独的文档/相册

导出类AlbumDetails实现OnInit{
folderId：字符串；
albumId：字符串；
私人albumDoc:AngularFirestoreDocument；
相册：可见；
建造师(
私人只读afs:AngularFirestore，
私有激活路由：激活路由，
专用路由器（路由器）{
//查看文件夹和相册ID的url并设置局部变量
this.activatedRoute.params.forEach（（urlParameters）=>{
this.folderId=urlParameters['folderId']；
this.albumId=urlParameters['albumId']；
});
this.albumDoc=afs.doc（`folders/${this.folderId}/albums/${this.albumId}`）；
this.album=this.albumDoc.valueChanges（）；
}
ngOnInit（）{}
}

---

任何帮助都将不胜感激：）

我不能100%确定我是否理解您的问题。据我所知，您希望获得文档返回数据的句柄，然后在HTML上显示之前对其进行更改

如果是这种情况，您可以执行以下操作：

this.albumDoc = afs.doc<any>(`folders/${this.folderId}/albums/${this.albumId}`);
this.album = this.albumDoc.valueChanges();
this.album.subscribe(value => {
  const value1 = value.value1;
  const value2 = value.value2;
  ...
  const valueN = value.valueN;
});

this.albumDoc = afs.doc<any>
(`folders/${this.folderId}/albums/${this.albumId}`);
  this.album = this.albumDoc.snapshotChanges();
  this.album.subscribe(value => {
    const id = value.payload.id;
    const value1 = value.payload.data().value1;
    const value2 = value.payload.data().value2;
    ...
    const valueN = value.payload.data().valueN;
});

---

this.albumDoc=afs.doc
你好，克里斯！这太近了。我如何获得返回的相册的ID？@威震天我已更新了我的答案，以便在您的评论中包含该案例的答案。如果我的答案对你有效，请你标记为已接受。嗨，克里斯。非常感谢您的回复。我是新手，所以订阅部分真的帮了我大忙。关于你上一篇文章的最后一件事，我如何将“value1”数据绑定到我的html？再次感谢你。我肯定会把这个作为答案。@威震天，这是我的荣幸。有几种方法可以做到这一点。一种方法是在AlbumDetails组件中声明属性，并通过插值绑定属性名。所以你要声明说value1:string；然后在组件中设置this.value1=value.payload.data（）.value1；例如，您将在html中包含{{value1}}。有关更多详细信息，请参阅。我已快速测试，它确实有效。您是否声明了value1:string；在组件的全局范围内。下面是导出类的详细信息。。。。