ngx-pagination angular 8 Observables 下一页未在 FE 上填充

Question

我对这个实现中使用的 Observables 有疑问。 我是 Observables 的新手。 我正在使用用户列表在现有组件上实现 ngx-pagination。 问题是下一页没有填充结果（只有第 1 页有 10 个第一个结果）但是正在进行 API 调用，我可以在网络选项卡中看到结果。 我认为这与 Observables 有关。 任何帮助将不胜感激。

零件

  pageSize: any;
  pageNumber = 1;
  count = 0;

 ngOnInit() {
    this.users$ = this.userapiService.getUsers(this.pageNumber);
  }

  handlePageChange(event) {
    this.pageNumber = event;
    this.users$ = this.userapiService.getUsers(this.pageNumber);
  }

html

      <tr *ngFor="let user of users$.getValue() | paginate: { itemsPerPage: pageSize, currentPage: pageNumber }">
               
     <pagination-controls 
                    (pageChange)="handlePageChange($event)"
                    previousLabel="Previous"
                    nextLabel="Next"
            ></pagination-controls>
 

服务

 getUsers(pageNumber: number): Observable<User[]> {

        let params = new HttpParams();

        params = params.append('id', id).append('pageNumber', (pageNumber - 1).toString())
            .append('pageSize', constants.pageSize);

        this.httpService.httpGet(this.Endpoint, params)
            .subscribe(
                (response: User[]) => {
                    this.users$.next(response
                        .filter(user =>  user
                        ));

                });
        return this.users$;
    }

Answer 1

正如 RxJS 5 的作者所说，在可观察链中使用getValue()是您做错事的标志。

在这种情况下，users$ 是一个可观察的 . 要获得可观察对象的最新值，我们需要订阅和收听。 我们使用 Angular 的 HTML 端的异步 pipe执行此操作，如下所示：

<tr *ngFor="let user of (users$ | async) | paginate: { itemsPerPage: pageSize, currentPage: pageNumber }">