我正试图在ionic3开发的移动应用中为搜索页面设置分页。即使提供了密钥,搜索结果也始终只获取前5个值。 我尝试使用不同的密钥,但问题仍然存在。 请找到以下代码
this.storeListRefss$ = this.db.list(`/productList/` + this.storeId + `/`, {
query: {
orderByChild: 'product_name_search',
limitToFirst: 5,
startAt: { value: 'milk', key: '-L2Z8INhE8mFA4fWwiGk' },
endAt: self.searchValue + "\uf8ff"
}
});
this.storeListRefss$.subscribe((result) => {
result.forEach((element) => {
self.searchResults.push(element);
});
console.log(this.searchResults);
});
这是从火力基地拉出的样本json数据
{
"-L2Z8Gvp-T5O3r46dQO4" : {
"product_desc" : "",
"product_img" : "",
"product_name" : "2-POCKET PAPER FOLDER",
"product_name_search" : "2-pocket paper folder",
"product_reg_price" : "0.7900",
"product_sales_price" : "0.7900",
"product_upc" : "718103177610",
"status" : 1
},
"-L2Z8Gvp-T5O3r46dQO5" : {
"product_desc" : "",
"product_img" : "",
"product_name" : "3 MUSKETEERS BITES",
"product_name_search" : "3 musketeers bites",
"product_reg_price" : "1.9900",
"product_sales_price" : "1.9900",
"product_upc" : "040000422471",
"status" : 1
}
}
答案 0 :(得分:2)
您使用的是旧版AngularFire,它不支持查询API中startAt()
或endAt()
的第二个参数。
您有两种选择:升级到新api或创建引用并将其传递给list()
方法。我建议升级到新版本5 API,这要简单得多。但我将在下面详述。
选项1 - 创建引用而不是使用查询API
constructor(private db: AngularFireDatabase) {
const ref = db.database.ref(`/productList/` + this.storeId);
const query = ref
.orderByChild('product_name_search')
.limitToFirst(5)
.startAt('milk', '-L2Z8INhE8mFA4fWwiGk')
.endAt(self.searchValue + "\uf8ff");
const list$ = db.list(query);
}
选项2 - 升级到新API
constructor(private db: AngularFireDatabase) {
const list$ = db.list(`/productList/` + this.storeId, ref => {
return ref
.orderByChild('product_name_search')
.limitToFirst(5)
.startAt('milk', '-L2Z8INhE8mFA4fWwiGk')
.endAt(this.searchValue + "\uf8ff");
}).valueChanges();
}