根据我的要求自定义角度材料的分页器组件

Question

在我的应用程序中，有一个组件使用角度材质表填充行。由于实现了服务器端分页，因此下面给出了json响应。

list - 包含表记录的对象。 next，first，last，previous - 这些对象链接将提供下一个/第一个/上一个/最后一页的数据。

我需要将next，first，last，previous的值分配给有角度的材质分页按钮。

有没有办法自定义分页按钮？请给我一些建议。

JSON响应：

{  
list: [],  
totalRecords: 100,  
message: "Patient search successfull",  
next: "http://localhost:8084/findPatient/?page=2&size=10&patientId=&patientFirstName=&patientLastName=",  
first: "http://localhost:8084/findPatient/?page=0&size=10&patientId=&patientFirstName=&patientLastName=",  
last: "http://localhost:8084/findPatient/?page=9&size=10&patientId=&patientFirstName=&patientLastName=",  
previous: "http://localhost:8084/findPatient/?page=0&size=10&patientId=&patientFirstName=&patientLastName=",  
size: 10,  
currentPage: 1
}

使用Angular 7和Spring Boot构建的Web应用程序。由于我是Angular的新手，我不知道为分页创建自定义指令。

Answer 1

您可以使用PageEvent来控制分页器行为

<mat-paginator [length]="length"
              [pageSize]="pageSize"
              [pageSizeOptions]="pageSizeOptions"
              (page)="onPageEvent($event)">
</mat-paginator>

onPageEvent(event: PageEvent) {
   this.yourService.loadData(event.pageIndex).....;
}