Как получить данные на всех страницах HTTP-запроса API, используя наблюдаемые в Angular?

Question

Я делаю запрос http.get к API для получения данных.API использует нумерацию страниц и содержит 30 записей на страницу.Он также предоставляет информацию о следующей странице и последней странице вместе с соответствующими ссылками (также предыдущей страницей и первой страницей, если применимо) в ссылках заголовка ответа.

Заголовок ссылки включает информацию о нумерации страниц:

<https://api.example.com/user?page=2>; rel="next", 
<https://api.example.com/user?page=10>; rel="last"

Объект JSON в response.body

[
  {
    userId: 1,
    name: 'John',
    created_at: "2015-10-13T03:10:43Z",
  },
  {
    userId: 2,
    name: 'Jane',
    created_at: "2019-02-15T13:37:03Z",
  }
....
]

Я использую angular 6 и пытаюсь накапливать данные, выполняя последующие вызовы http.get.Я пытался использовать метод массива push () для последующих данных.Но поскольку typeof resp.body является объектом, он не работает.

userData: any[];

getData(url: string) {
    this.http.get(url, {observe: 'response'});
        .subscribe((resp) => {
        this.userData.push(resp.body);
}

Сообщение об ошибке: TypeError: Невозможно прочитать свойство 'push' из неопределенного

UserData должна содержать массив данныхполученные от http.get запросы, которые можно повторять.

Answer 1

Сначала инициализируйте массив, затем нажмите. Следующий код выглядит следующим образом.

userData: any[] = [];

getData(url: string) {
  this.http.get(url, {
   observe: 'response'
  });
  .subscribe((resp) => {
     // this.userData = [];
     this.userData.push(resp.body);
}

Answer 2

userData: any[] = [];

userData не инициализирован, что вызывает эту ошибку.Попробуйте с пустым Array.

Answer 3

, как упоминалось в предыдущем ответе, вы должны инициализировать свой массив, прежде чем сможете использовать для него push ().

Но если я правильно понимаю, вы получите массив user для каждого ответа.Нажав на каждый ответ, вы получите массив массивов.Вы должны либо использовать concat для объединения двух массивов, либо использовать foreach в ответе, а затем нажать.

также я бы порекомендовал вам использовать интерфейсы или классы и стараться избегать любых

interface UserData {
  userId: number;
  name: string;
  created_at: string;
}

userData: UserData[] = [];

getData(url: string) {
  this.http.get(url, {observe: 'response'})
    .subscribe((resp) => {
      resp.body.forEach((user: UserData) => {
        this.userData.push(user);
      });
    });
}

Answer 4

Вы не можете .push в неинициализированный массив.

Попробуйте сделать это:

userData = [];