Angular 9-具有Firebase和Cloud Firestore的后端
埃拉德雷斯多尔
对于前端（角度）有服务器，后端在Firebase中，我正在使用Cloud Firestore。
我尝试了实时数据库，一切正常，但是我想尝试Cloud Firestore及其集合。
问题如下：
这是组件：
items: Array<any>;
constructor(private aboutUsService: AboutUsService) { }
ngOnInit() {
this.getData();
}
getData() {
this.aboutUsService.getContent()
.subscribe(data => {
this.items = data;
console.log('items: ', this.items);
}, // Bind to view
err => {
console.log(err);
});
}
这是服务：
getContent() {
return this.db.collection('aboutus').snapshotChanges();
}
目前，我在Cloud Firestore中有一个收藏集：
规则Cloud Firestore：
service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
allow read, write: if true;
}
}
}
服务响应并返回带有元素的以下数组（这是this.items的内容）：
[{…}]
0:
payload: {type: "added", doc: n, oldIndex: -1, newIndex: 0}
type: "added"
这些是Chrome网络标签中的标题：
Request URL: http://localhost:4200/aboutus
Request Method: GET
Status Code: 304 Not Modified
Remote Address: 127.0.0.1:4200
但是我无法找到该集合的数据以在前端显示它（可变this.items）。
如果我在响应数组中将元素添加到集合“ aboutus”中，则它对应于集合中的元素，但我无法可视化数据。
可能是什么问题呢？谢谢
埃德里克
正如我在2个多星期前（5月15日）的评论中所提到的：
您应该使用
AngularFirestoreCollection.valueChanges，它返回Observable集合值的，同时AngularFirestoreCollection.snapshotChanges在快照上显示其他元数据。有关更多信息，请考虑查看文档：https : //github.com/angular/angularfire/blob/master/docs/firestore/collections.md
因此，您应将snapshotChanges呼叫替换为valueChanges：
getContent() {
return this.db.collection('aboutus').valueChanges();
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
Cloud 9，Angular和Express
- 2
Firebase Angular9
- 3
具有多个条件和Angular 9的RxJS iif
- 4
具有多个条件和Angular 9的RxJS iif
- 5
如何设置具有节点后端的 Angular 8 应用程序并将其托管在 firebase 上？
- 6
连接到Firebase / Firestore时出错：无法访问Cloud Firestore后端
- 7
Swift DispatchGroup 导致错误：[Firebase/Firestore][I-FST000001] 无法访问 Cloud Firestore 后端
- 8
后端的Firebase管理员用于verifyIdToken并使用Firestore
- 9
Angular 9有什么新功能？
- 10
带有@Injectable（）的Angular 9 BaseComponent
- 11
具有Oracle 10g Express后端的VFP 9前端应用程序
- 12
Angular 2前端和Laravel 5 *后端
- 13
Angular 9和Storybook：添加@ angular / localize / init polyfill
- 14
有关测试Angular $ localize（Angular 9）的建议
- 15
使用Android模拟器上的Firestore模拟器无法到达Cloud Firestore后端
- 16
Angular 9如何删除具有用户指定索引范围的数组内的对象范围？
- 17
Angular 9-具有相同formControlName名称的不同formGroupName影响相同的formControlName
- 18
Angular 9 TestBed.inject和提供程序覆盖
- 19
迁移到Angular 9和“ src / ** / *。d.ts”包括
- 20
Angular 9，KeyCloak，ServiceWorker和Edge浏览器
- 21
使用Jest和Testbed测试Angular 9服务
- 22
Angular9的反应形式和原子设计
- 23
Angular 9-组件输入和输出性能调整
- 24
Angular 9退订NavigationEnd
- 25
更新到Angular 9
- 26
Angular 9中的时区
- 27
带有子入口点的Angular 9库循环依赖
- 28
带有Angular 9的摩纳哥编辑器未显示
- 29
Angular 9-父母内部有多个孩子
我来说两句