角度:无法创建分页循环

Question

我正在调用仅列出30个结果作为响应的API。使用多个页面，我需要创建一个while循环，以调用API并为每个调用存储数据，直到剩下没有页面为止。

我尝试了几种方法。我有一个调用API并返回数据的服务。在我的组件中，我试图调用该服务，获取数据，然后再次调用它，存储更多数据等。

当前我正在使用.Reduce存储数据并将其分成键/值对。

export class SectionDashboardComponent implements OnInit {
constructor(private _freshServiceService: freshServiceService) { }
private ticketCounts: number[];
private ticketResponders: string[];
keyValMap = {};
ngOnInit() {
let thisPage = 1;
this._freshServiceService.fetchTickets(thisPage).subscribe
(
  data =>
  {
    while(data.length > 0){
       thisPage += 1;
       this.getTicketData(data);
    }
  },
  err=> {
    console.log(err);
    if(err.status == "500"){
      console.log('yes')
    }
  }
);
  }

private getTicketData(tickets: Ticket[]): void {
  this.keyValMap = tickets.reduce((x, y) => {
  {x[y.responder_name] = x[y.responder_name] + 1 || 1};
  return x;
  }, this.keyValMap); 
  this.ticketResponders = Object.keys(this.keyValMap);
  this.ticketCounts = Object.values(this.keyValMap);
console.log(this.ticketResponders);
console.log(this.ticketCounts);
}
}

我尝试过的所有操作都会使我的应用程序无限运行，并且永远不会更新"数据"变量，或者它不会更新页码。我不知道如何将实际的服务呼叫包括在内部循环中并订阅它并在每次调用时更改它。这可能吗？

旁注：，我意识到上面的代码显然不是解决方案，因为while循环不包括呼叫。我不太确定该怎么做。任何帮助是极大的赞赏。

Answer 1

这是我的方法：

首先要提及的点：

• 我的分页只包含上一个或下一页的选项。没有选择任何中间页的选项。
• 我使用ngrx商店来存储分页相关的数据和最终结果。
• 我在后端使用了带有节点的mongodb。

步骤：

1. 页面加载后，我致电我的API以获取20个结果。(默认情况下，所有数据都是按_id降序的(。我仅在用户移动到新页面时才获取数据。
2. 在每个新结果中，我都存储了文档的第一个也是最后一个_id。
3. 如果用户单击下一页，则向API提出了新的请求。在请求的查询参数中，我传递了两个代表结果的最后ID的属性和"下一个"。
4. 对于上一页，第一个ID和" prev"值类似。

希望它有帮助。