Угловой запрос GET от API-интерфейса с нумерацией страниц (Следующая страница) - PullRequest
Новая
       10

Угловой запрос GET от API-интерфейса с нумерацией страниц (Следующая страница)

0 голосов
/ 10 января 2019

Мне нужно получить данные из пагинации API отдыха Я использую следующий код, но не могу загрузить информацию в шаблон Будем весьма благодарны за любые предложения о лучшем подходе!

component.ts 

import { Component, OnInit } from '@angular/core';
import {HttpClient} from '@angular/common/http';


@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

  articles: any[];
  url = 'https://example.zendesk.com/api/v2/users.json';
  // finished = false;

  constructor(private httpClient: HttpClient) { }

  ngOnInit() {
    this.getArticles(this.url, this.articles);
  }

  getArticles(url: string, articles: any[]) {
    this.httpClient.get(url).toPromise().then(response => {
      console.log(response['next_page']);
      if (articles === undefined) { articles = response['articles']; } else { articles = articles.concat(response['articles']); }
      console.log(articles);
      if (response['next_page'] != null) {
        this.getArticles(response['next_page'], articles);
      } else { console.log('End'); return articles; }
    });
  }

}

HTML 

<ul *ngIf="articles">
  <li *ngFor="let article of articles">
    {{ article.title }}
  </li>
</ul>

Ответы [ 2 ]

0 голосов
/ 10 января 2019

Я считаю, что проблема в том, что мне нужно было подписаться на информацию, теперь она работает. Все равно спасибо:) 

import { Component, OnInit } from '@angular/core';
import {HttpClient} from '@angular/common/http';


@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

  articles: any[];
  url = 'https://example.zendesk.com/api/v2/users.json';

  constructor(private httpClient: HttpClient) { }

  ngOnInit() {
    this.getArticles(this.url, this.articles);
  }

  getArticles(url: string, articles: any[]) {
    this.httpClient.get(url).subscribe(data => {
      if (articles === undefined) { articles = data['articles']; } else { articles = articles.concat(data['articles']); }
      if (data['next_page'] != null) {
        this.getArticles(data['next_page'], articles);
      } else { console.log('Finished'); }
      this.articles = articles;
    });
  }

}
0 голосов
/ 10 января 2019

Без дополнительной информации, как спросил Игорь, я думаю, что вы неправильно делаете, что в функции getArticles(url: string, articles: any[]) вы устанавливаете articles из параметров вашей функции, а не из свойства вашего компонента. Вы должны использовать this.articles так: 

  getArticles(url: string, articles: any[]) {
    this.httpClient.get(url).toPromise().then(response => {
      console.log(response['next_page']);
      if (this.articles === undefined) { this.articles = response['articles']; } else { this.articles = this.articles.concat(response['articles']); }
      console.log(this.articles);
      if (response['next_page'] != null) {
        this.getArticles(response['next_page'], this.articles);
      } else { console.log('End'); return this.articles; }
    });
  }
...