如何在 Angular 4 ngx 分页中显示每页的记录
Posted
技术标签:
【中文标题】如何在 Angular 4 ngx 分页中显示每页的记录【英文标题】:how to display records per page in angular 4 ngx pagination 【发布时间】:2018-07-22 13:08:07 【问题描述】:我已经在 Angular 4 中安装了 ngx 分页。一切正常。
我想每页显示记录。 IE。
(Showing: 1 - 10 / 25 )
。我已经尝试过,但我没有得到任何解决方案。你能帮我解决这个问题吗?提前致谢。
【问题讨论】:
embed.plnkr.co/JVQMPvV8z2brCIzdG3N4 @bashirudeen,你的问题得到答案了吗?我也遇到了同样的问题 @Bhrungarajni 我也在寻找这个解决方案 @C.Ikongo,我做了自定义代码,对我有用,我会发布我的答案,你可以看看 @Bhrungarajni 有机会我会试试的 【参考方案1】:您可以在 NgFor 表达式的末尾使用PaginatePipe
。您可以传递要显示的记录数作为配置选项。
<element *ngFor="let item of collection | paginate: itemsPerPage: pageSize,
currentPage: p,">...</element>
【讨论】:
感谢您的快速回复。我已经完成了这个分页。我想在底部显示(显示:11 - 20 / 25)。【参考方案2】:我一直以这种方式工作,它有所帮助,
public setPageNumbers(pageNo,pageSize)
this.startValue = (pageNo * pageSize) - (pageSize -1)
this.lastValue = this.agentParms.pageNo * this.agentParms.pageSize;
this.lastValue = this.lastValue > this.agentTotal ? this.agentTotal: this.lastValue;
所以在这里我乘以当前页码和页面大小,并减去当前页面大小,所以我得到第一个值,并获得最后一个值,检查页码。和页面大小,并将其显示为最后一个值。如果最后一个值大于总计数,则将总计数作为最后一个值。
希望这会有所帮助。
【讨论】:
以上是关于如何在 Angular 4 ngx 分页中显示每页的记录的主要内容,如果未能解决你的问题,请参考以下文章