Как преобразовать Observable <any> в массив []

У меня есть следующий метод в typescript, мне нужно привязать к angular сетке

CountryService

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

GridComponent

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

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

CountryData​​strong > 

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

Но GetCoutries вернет Observable из любого, неспособного привязать к rowData?

Как преобразовать Observable в CountryData [] в typescript?

вы найдете данные JSON здесь: http://services.groupkt.com/country/get/all

Ответы

Ответ 1

Вам нужно будет подписаться на ваши наблюдаемые данные:

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

И в вашем html, где нужно, вы можете передать ему async.

Ответ 2

Используя HttpClient (замена Http) в Angular 4.3+, весь процесс сопоставления/литья упрощается/исключается.

Используя свой класс CountryData, вы должны определить метод службы следующим образом:

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

Затем, когда вам это нужно, определите такой массив:

countries:CountryData[] = [];

и подпишитесь на него следующим образом:

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

Здесь также размещен полный ответ на настройку .

Ответ 3

Это должно работать:

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

Чтобы это работало, вам необходимо импортировать следующее:

import 'rxjs/add/operator/map'

Ответ 4

//Составная часть. home.ts:

  contacts:IContacts[];


ionViewDidLoad() {
this.rest.getContacts()
.subscribe( res=> this.contacts= res as IContacts[]) ;

//reorderArray. принимает только массивы

    Reorder(indexes){
  reorderArray(this.contacts, indexes)
}

//Сервис. res.ts

getContacts(): Observable<IContacts[]> {
return this.http.get<IContacts[]>(this.apiUrl+"?results=5")

И это прекрасно работает