angular - Observable'ı dizi[]'ye nasıl dönüştürürüm

Typescript'te aşağıdaki metoda sahibim, bunu Angular grid'e bağlamam gerekiyor

ÜlkeHizmeti

GetCountries()  {
  return this.http.get(`http://services.groupkt.com/country/get/all`)
    .map((res:Response) => <CountryData[]>res.json().RestResponse["result"]);
}

GridBileşeni

  template: `
        <ag-grid-ng2 style="width: 100%" #agGrid class="ag-material"
                    rowHeight="50"
                    [gridOptions]="myGridOptions" 
                     >
            </ag-grid-ng2>
        `,

  this.myGridOptions.rowData= this.CountryService.GetCountries();

ÜlkeVerileri

export class CountryData{
  name: string;
  alpha2_code: string;
  alpha3_code: string;
}

Ama GetCountries herhangi bir Observable döndürecek, rowData'ya bağlanamıyor mu?

Typescript'te Observable'ı CountryData[]'e nasıl dönüştürürsünüz ?

JSON verilerini burada bulabilirsiniz: http://services.groupkt.com/country/get/all

Cevap #1

Gözlemlenebilirlerinize abone olmanız gerekecek:

this.CountryService.GetCountries()
    .subscribe(countries => {
        this.myGridOptions.rowData = countries as CountryData[]
    })

Ve html'inizde, gerekli olan her yerde, ona async borusunu geçirebilirsiniz.

Cevap #2

Angular 4.3+ sürümünde HttpClient (Http’nin yerine geçen) kullanılarak, tüm eşleme/dönüştürme süreci daha basit hale getirilmiş veya ortadan kaldırılmıştır.

CountryData sınıfınızı kullanarak, bu şekilde bir servis yöntemi tanımlarsınız:

getCountries()  {
  return this.httpClient.get<CountryData[]>('http://theUrl.com/all');
}

O zaman ihtiyaç duyduğunuzda, bu şekilde bir dizi tanımlayın:

countries:CountryData[] = [];

ve buna şöyle abone olun:

this.countryService.getCountries().subscribe(countries => this.countries = countries);

Tam bir kurulum cevabı da burada yayınlandı.

İlgili makaleler