问题描述
我正在尝试建立一个以AngularFireStore
作为数据存储的网页。为了启用无限滚动,我尝试使用limit
的{{1}}和startAfter
功能查询商店。
由于某种原因,我无法使其正常运行。 AngularFireStore
功能无法正常工作,因为它返回的值大于/小于实际限制,并且还有重复的值
我已经搜索并尝试了几种方法(this,this,this)。但是什么都行不通。
这是我尝试过的:
crudService.ts:
limit
component.ts
readNextPost(cursor){
return this.firestore.collection('MyCollection',ref => ref.orderBy('date','desc')
.startAfter(cursor)
.limit(10)
).snapshotChanges();
}
mapResponseToObject(data) {
return {
id: data.payload.doc.id,doc: data.payload.doc
}
}
setLastPost(data) {
this.lastFetchedPost = data[data.length - 1].doc;
}
fetchNextPosts() {
this.crudService.readNextPost(this.lastFetchedPost).subscribe(data =>{
let nextPost = data.map(this.mapResponseToObject)
this.allPosts = [...this.allPosts,...nextPost];
this.setLastPost(nextPost);
})
}
返回的值小于readNextPost
,尽管存储中的值大于10
,有时返回的值大于10
,后者具有较早获取的值。
这会导致在网页中看到重复的数据。
作为AngularFireStore
和Angular 10
的新手,我在这个问题上停留了几个小时。任何帮助将非常感激。非常感谢。
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)