目前,我正在处理一组相当复杂的 firestore 查询。
我试图同时填充一个包含对其他文档的引用的数组,然后读取这些文档并将信息放入一个数组中。
更具体地说,我在一个集合中有 4 个引用。我想获取这些引用,然后使用这些引用查询 4 个文档并用信息填充一个数组。
顺序如下:查询tags
子集合中的所有文档,由下面的函数处理:
getTagsOnPage(workspaceId: string, pageId: string) {
// get all of the references in the tags sub-collection, and puts them in an array
// get all id's, do not get data
return this.afs
.collection("users")
.doc(`${auth().currentUser.uid}`)
.collection<Workspace>("workspaces")
.doc(`${workspaceId}`)
.collection<Page>("pages")
.doc(`${pageId}`)
.collection("tags")
.snapshotChanges()
.pipe(
map((actions) => {
return actions.map((a) => {
const ref = a.payload.doc.get("reference");
return ref; // return an array of (id: reference) key-value pairs
});
})
);
}
这适用于执行订阅的以下代码:
this.pageService
.getTagsOnPage(this.workspaceId, this.currentPage.id)
.subscribe((data) => {
temp = data;
});
数据
如下,通过控制台:
(3) ["/users/ucB5cF4Pj3PWhRn10c9mvqQbS7x2/workspaces/It1…1tSnPI5GJrniY82vZL/localTags/1p5Tscwn14PyK6zRaFHX", "/users/ucB5cF4Pj3PWhRn10c9mvqQbS7x2/workspaces/It1tSnPI5GJrniY82vZL/localTags/lFKoB0jngmtnALut2QS2", "/users/ucB5cF4Pj3PWhRn10c9mvqQbS7x2/workspaces/It1tSnPI5GJrniY82vZL/localTags/r6sf2SX6v87arU2rKsD5"]
现在,执行下一组数据读取是我开始困惑的地方。
我最初的方法是尝试 for 循环(针对此数组的长度),但这将涉及迭代执行多个嵌套订阅,我认为从这个意义上讲这是不可能的。
我是 rxjs 的新手,只使用过 map 和 switchMap 运算符。在这种情况下,我想我会使用 mergeMap
和/或 flatMap,
之类的东西,但坦率地说,我不确定在这种情况下如何进行这项工作。此外,处理 for 循环时我需要根据我得到的 documentReferences 数组获取文档,这也让我陷入了循环。
这是我目前的实现,到处都是;我希望对我正在尝试做的事情有感觉。基本上,通过 getTagsOnPage 获取引用数组,等待 observable 结束,使用 switchMap 获取数据数组并对其进行循环;理想情况下,订阅每个 ref 并添加到 tagData,然后返回:
let tagData;
this.pageService.getTagsOnPage(this.workspaceId, this.currentPage.id).pipe(
switchMap((data) => {
let references = data;
for (let j = 0; j < references.length; j++) {
let ref = this.afs.doc(`${references[j]}`);
ref.snapshotChanges().pipe(
map((actions) => {
const data = actions.payload.data();
tagData.push(data);
})
);
// push the data (different data var)
}
})
);
return tagData;
我知道这很困惑,但我认为一旦我知道了正确的运算符来使用它就会更有意义。
此外,atm 这会返回一个空数组。当我使用 switchMap 时出现以下错误:
Argument of type '(data: any[]) => void' is not assignable to parameter of type '(value: any[], index: number) => ObservableInput<any>'.
Type 'void' is not assignable to type 'ObservableInput<any>'.
感谢您的帮助!
最佳答案
使用 switchMap
时出错的原因是因为您没有返回 Observable。
当使用任何“Higher Order Mapping Operators”(switchMap、concatMap、mergeMap 等)时,所提供的函数必须返回一个可观察对象。如错误所述:“类型 void
不可分配给类型 ObservableInput<any>
”,您不会返回任何内容(无效)。
接下来不太正确的是,在循环中,您引用了 ref.snapshotChanges().pipe()
,但您从不订阅它。您可能知道,Observable 是惰性的,除非有订阅者,否则不会触发。
只要你在 switchMap()
中返回一个可观察对象,它将自动订阅它并发出它的值。
让我们换个 Angular 思考这个问题;而不是遍历第一次调用的结果,执行它们,然后将值插入数组。相反,我们可以获取结果并将它们变成一个可观察的流,该流发出它们各自调用的所有结果,并为您将它们组合成一个数组。但是......有一个细微的差别:我建议不要有一个单独的 tagData
流外的数组,但要让您的可观察对象返回 tagData
您需要的表格 Observable<TagData[]>
.
我认为这样的事情对你有用:
tagData$ = this.pageService.getTagsOnPage(this.workspaceId, this.currentPage.id).pipe(
switchMap(references => from(references)),
mergeMap(ref => this.afs.doc(ref).snapshotChanges()),
map(actions => actions.payload.data()),
scan((allTagData, tagData) => [...allTagData, tagData], [])
})
);
让我们分解一下!
现在,你可以简单地做:tagData$.subscribe()
并用结果数组做你想做的事。或者你甚至可以使用 async pipe在您的模板中而不是在您的组件中订阅。
关于javascript - 从文档引用数组中获取 firestore 文档,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63404928/