javascript - Angular 4'te birden fazla Http İsteği nasıl kullanılır


Angular 4 ve istekleri için birkaç sayfası olan bir API ile basit bir uygulama yapıyorum.

Örneğin bu URL ile ilk 10 karakteri alıyorum: http://swapi.co/api/people/

Ve sonraki 10 kişiyi almak için bu URL'ye istek yapmam gerekiyor: http://swapi.co/api/people/?page=2

Tüm insanları tek bir istekte nasıl alabilirim? Veya tüm istekleri iyi uygulamalarla yapmak için çözüm nedir?

Cevap #1

Birden fazla kaynaktan veri yüklemek için forkJoin yöntemini kullanmanız gerekir.

Her şeyden önce, onları typescript dosyasına dahil edin.

import {Observable} from 'rxjs/Rx';

GÜNCELLEME

Angular'ın yeni sürümleri için bunu kullanın:

import { forkJoin } from 'rxjs';

Çoğu zaman, verileri birden fazla kaynaktan yüklememiz gerekir ve tüm veriler yüklenene kadar beklememiz gerekir.

forkJoin yöntemi birden fazla Observable’ı sarar. Başka bir deyişle, forkJoin’i eşzamanlı http isteklerini çalıştırmak için kullanırız.

forkJoin metodunun subscribe() yöntemi, tüm Observables kümesi üzerinde işleyicileri ayarlar.

Burada forkJoin hakkında, birçok örnek dahil olmak üzere, daha fazla okuyabilirsiniz.

Diyelim ki ilk 10 sayfayı almanız gerekiyor.

var pages:number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

Veya kısaca: var pages:number[]=new Array(10).fill().map((v, i) => i + 1);

// map them into a array of observables and forkJoin
return Observable.forkJoin(
   pages.map(
      i => this.http.get('http://swapi.co/api/people/?page=' + i)
        .map(res => res.json())
   )
).subscribe(people => this.people = people);

İlgili makaleler