我正在使用Angular 6创建一个科学文章搜索引擎,我需要添加分页。 这是我的搜索功能
search() {
var query: string = window.location.search.substring(1).split("=")[1];
this.http
.get(
"http://my.json/_search?q=" +
query +
"&size=100"
)
.subscribe(response => {
this.response = response;
});
}
因此,目前我只检索100篇文章。该数据库当前有15,000多条文章,因此,我限制了页面加载后接收的文章数量。在最坏的情况下,我可以轻松地放&size=15000
,但这会花费很长的页面加载时间。有没有办法一次加载几篇文章,比如说10条,然后每次我移到另一页时,还会从JSON中抽取另外10条?
我目前也在使用它进行分页
<div *ngFor="let hit of response.hits.hits | orderBy: key : true | paginate: { itemsPerPage:6, currentPage: p} let i = index">
<!--HTML Code in here-->
</div>
<pagination-controls (pageChange)="p =$event"></pagination-controls>
答案 0 :(得分:0)
@BryanBastida,当然。通常,您的服务器只需要两件事:
1.-一个返回文章数的函数(必须进行分页)
2。-该函数返回的下一个10个项目比“键”大。只是在Angular中将每个页面的“键”存储在数组中。
/*If your page=0 show 1,2,5,6,9 and page=1 show 10,12,15,16,17
lastItem[0]=9, lastItem[1]=17;
*/
lastItem:any[]=[];
//Each change of page
changePage(page)
{
let firstItem=page==0?:null:(firstItem.length<page-1)?firstItem[page-1]:lastItem;
get("myUrl?firstItem=firstItem).subscribe(res=>{
if (res)
{
lastItem[page]=res[res.length-1].key
this.data=res;
}
)
}