Angular4 自制分页控件

过年后第一波，自制的分页控件，可能功能没有 PrimeNG 那么好，但是基本可以实现自定义翻页功能，包括：首页/最后一页/上一页/下一页。

用户可以自定义：

1. 当前默认页码（如未提供，默认为第一页）

2. 最大显示几个页码（如未提供，默认为5）

3. 每页显示几条数据 （如未提供，默认为5）

例子，共10条数据

 

<paginator [totalRecords]="10"

           [rows]="3"

           [currentPage]="0"

           (onPageChange)="paginate($event)">

</paginator>

 

<paginator [totalRecords]="10"

           [rows]="1"

           [currentPage]="0"

           (onPageChange)="paginate($event)">

</paginator>

HTML:

<ul class="pageUi clear">

<li (click)="changePage('first')"

class="fa fa-angle-double-left"

[ngClass]="{'disable': pageValidation.isFirst}">

</li>

<li (click)="c