我正在使用AngularFire + FireStore开展一些项目。
我的Firestore模型如下所示:
Collection 1
收集2
现在我需要显示列表,其中我有来自第一个集合的一些数据,以及来自另一个集合的一些数据。如何创建这样的列表?
制作两个可观察对象然后合并它似乎毫无意义。
const collection = this.afStore.collection<any>(collectionName);
return collection.snapshotChanges()
.map(participants => {
return participants.map(participant => {
const data = participant.payload.doc.data();
const id = participant.payload.doc.id;
return {id, ...data};
});
});
我有这个带有数据+ id的代码,现在我需要使用这个id从另一个集合中提取数据,但不知道如何。
答案 0 :(得分:5)
以下是我的做法......
“projects”数据包含customer_doc_id,customer_builder_doc_id,customer_contractor_doc_id,它们是Firestore中其他数据集合的doc_id。命令mergeMap适用于rxjs ^ 5.5.0。
private getProjectsCombineObservables(): Observable<any[]> {
this.projectsCollection = this.afs.collection<Project>('projects', ref =>
ref.orderBy('job_number', 'desc'));
return this.projectsCollection.snapshotChanges()
.map(actions => {
return actions.map(a => {
const project_data = a.payload.doc.data() as Project;
const doc_id = a.payload.doc.id;
let observable1 = this.getCustomer(project_data.customer_doc_id);
let observable2 = this.getBuilder(project_data.customer_builder_doc_id);
let observable3 = this.getContractor(project_data.customer_contractor_doc_id);
const combinedData = Observable.combineLatest(observable1, observable2, observable3, (data1, data2, data3) => {
return { ...data1, ...data2, ...data3 };
});
return combinedData.map(data => Object.assign({}, { doc_id, ...project_data, ...data }));
});
}).mergeMap(observables => Observable.combineLatest(observables));
}
答案 1 :(得分:1)
Wohoo!我做到了:)
所以它应该是这样的:
const collection = this.afStore.collection<any>('collection1');
return collection.snapshotChanges()
.map(participants => {
return participants.map(participant => {
const data = participant.payload.doc.data();
const id = participant.payload.doc.id;
return this.afStore.doc('collection2/' + id).valueChanges()
.map(data2 => Object.assign({}, {id, ...data, ...data2}));
});
}).flatMap(observables => Observable.combineLatest(observables));
&#13;
答案 2 :(得分:1)
const collection = this.afStore.collection<any>('collection1');
return collection.snapshotChanges()
.map(participants => {
return participants.map(participant => {
const data = participant.payload.doc.data();
const id = participant.payload.doc.id;
return this.afStore.doc('collection2/' + id).valueChanges()
.map(data2 => Object.assign({}, {id, ...data, ...data2}));
});
}).flatMap(observables => Observable.combineLatest(observables));
答案 3 :(得分:1)
在尝试多种解决方案后,我使用 RXJS combineLatest, take 运算符完成了它。使用 map 函数我们可以组合结果。
combineLatest(
this.fireBaseService.getFromCollection1(),
this.fireBaseService.getFromCollection2(),
//In collection 2 we have document with reference id of collection 1
)
.pipe(
take(1),
).subscribe(
([dataFromCollection1, dataFromCollection2]) => {
this.dataofCollection1 = dataFromCollection1.map((data) => {
return {
id: data.payload.doc.id,
...data.payload.doc.data() as {},
}
as IdataFromCollection1;
});
this.dataofCollection2 = dataFromCollection2.map((data2) => {
return {
id: data2.payload.doc.id,
...data2.payload.doc.data() as {},
}
as IdataFromCollection2;
});
console.log(this.dataofCollection2, 'all feeess');
const mergeDataFromCollection =
this.dataofCollection1.map(itm => ({
payment: [this.dataofCollection2.find((item) => (item.RefId === itm.id))],
...itm
}))
console.log(mergeDataFromCollection, 'all data');
},