简体   繁体   中英

typescript observable subscription undefined

I make an http request to get some data which I am trying to display in the following:
I have a dropdown select to show entriesPerPage and a left and right cursor to switch page in my pagination. This works, but when I switch a page it always shows that

Cannot read property 'page' of undefined

In addition to that I can't show the totalEntries or totalPages at all, they don't seem to work in data binding either.

component.ts

  public getArticles(): void {
    this.articleService.getAllArticlesWithPagination(this.paginationResponse.pagination)
      .subscribe((data) => {
        this.dataSource.data = data.data;
        this.paginationResponse.pagination.page = data.pagination.page;
        this.paginationResponse.pagination.entriesPerPage = data.pagination.entriesPerPage;
        this.paginationResponse.pagination.totalEntries = data.pagination.totalEntries;
        this.paginationResponse.pagination.totalPages = data.pagination.totalPages;

      });
    console.log(this.paginationResponse); // added for this question after comments
  }

pagination.response

export class PaginationResponse<T> {

  public data: T[];
  public pagination: Pagination;

  constructor() {
    this.pagination = new Pagination();
  }
}

pagination.ts

export class Pagination {

  public static readonly DEFAULT_SIZE = 5;
  public static readonly FIRST_PAGE = 0;
  public static readonly DEFAULT_TOTAL = 3;
  public static readonly DEFAULT_ENTRIES = 10;

  public page: number;
  public entriesPerPage: number;
  public totalPages: number;
  public totalEntries: number;

  constructor() {
    this.page = Pagination.FIRST_PAGE;
    this.entriesPerPage = Pagination.DEFAULT_SIZE;
    this.totalEntries = Pagination.DEFAULT_ENTRIES;
    this.totalPages = Pagination.DEFAULT_TOTAL;
  }
}

console.log(this.paginationResponse) 在此处输入图片说明

EDIT: So it seems the paginationResponse.pagination is never actually filled with the data of data . Interesting is that data alone shows the fields of the pagination (totalPages, totalEntries, page, entriesPerPage) in addition to the data[] but data.pagination shows only those who are defined in the constructor of Pagination.ts (code snipped above). I don't see why it doesn't add the pagination to it.

SOLUTION: I expected the return in PaginationResponse to wrap my object of Pagination . I removed the pagination from it and instead put the 4 fields in it. So the answers despite being short seems about right.

从我看到的data.pagination是未定义的。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM