如何在以下代码中加入分页的功能 后端代码：@Query( "select approvalRecord from ApprovalRecord approvalRecord inner join ApprovalRecordItem approvalRecordItem on approvalRecord = approvalRecordItem.approvalRecord where approvalRecordItem.status <> 'AUDITING' and approvalRecordItem.createdBy.login = ?#{principal.username} order by approvalRecordItem.id desc" ) List<ApprovalRecord> findAuditedByCurrentUser(); @GetMapping("/approval-records/my-created") public List<ApprovalRecord> getAllCreatedApprovalRecords() { log.debug("REST request to get all getAllCreatedApprovalRecords"); return approvalRecordRepository.findByCreatedByIsCurrentUser(); } 前段代码： queryAuditing(req?: any): Observable<EntityArrayResponseType> { const options = createRequestOption(req); return this.http .get<IApprovalRecord[]>(${this.resourceUrl}/my-auditing, { params: options, observe: 'response' }) .pipe(map((res: EntityArrayResponseType) => this.convertDateArrayFromServer(res))); } loadAll(): void { this.approvalRecordService.queryAuditing().subscribe((res: HttpResponse<IApprovalRecord[]>) => { this.auditingApprovalRecords = res.body ?? []; });

可以在后端代码中使用分页查询，如下所示：

@Query("select approvalRecord from ApprovalRecord approvalRecord inner join ApprovalRecordItem approvalRecordItem on approvalRecord = approvalRecordItem.approvalRecord where approvalRecordItem.status <> 'AUDITING' and approvalRecordItem.createdBy.login = ?#{principal.username} order by approvalRecordItem.id desc")
Page<ApprovalRecord> findAuditedByCurrentUser(Pageable pageable);

然后在前端代码中调用分页查询接口，并在请求参数中传递分页参数，如下所示：

queryAuditing(req?: any): Observable<HttpResponse<IApprovalRecord[]>> {
  const options = createRequestOption(req);
  return this.http.get<IApprovalRecord[]>(`${this.resourceUrl}/my-auditing`, {
    params: options,
    observe: 'response'
  });
}

loadAll(page: number): void {
  const pageSize = 10; // 每页显示的数据数量
  this.approvalRecordService.queryAuditing({
    page: page.toString(),
    size: pageSize.toString()
  }).subscribe((res: HttpResponse<IApprovalRecord[]>) => {
    this.auditingApprovalRecords = res.body ?? [];
  });
}

注意，在调用分页查询接口时，需要传递 `page` 和 `size` 参数，分别表示当前页数和每页显示的数据数量。在前端代码中，可以使用一个函数来处理分页按钮的点击事件，如下所示：

loadPage(page: number): void {
  this.page = page;
  this.loadAll(this.page - 1); // 注意：后端接口的页数是从 0 开始计算的，所以这里需要减去 1
}

然后在模板中使用 `ngx-pagination` 组件来显示分页按钮，如下所示：

<div class="row justify-content-center">
  <jhi-item-count [page]="page" [itemsPerPage]="itemsPerPage" [totalItems]="totalItems" [queryCount]="true"></jhi-item-count>
</div>
<div class="row justify-content-center">
  <jhi-pagination [page]="page" [pageCount]="pageCount" [maxSize]="5" (pageChange)="loadPage($event)"></jhi-pagination>
</div>