Question

我在打字稿中有以下方法，我需要绑定到角度网格

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

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

但GetCoutries将返回任何Observable，无法绑定到rowData？

如何在文字夹中将Observable转换为CountryData []？

您可以在此处找到JSON数据：http://services.groupkt.com/country/get/all

Answer 1

您需要订阅您的观察信息：

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

并且，在您的html中，您可以将async管道传递给它。

Answer 2

在Angular 4.3+中使用HttpClient（Http＆＃39;替换），整个映射/转换过程变得更简单/消除。

使用CountryData类，您将定义如下服务方法：

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

然后在需要时，定义一个这样的数组：

countries:CountryData[] = [];

并订阅它：

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

完整的设置答案is posted here也是。

Answer 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'

Answer 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")

并且工作正常

如何将Observable <any>转换为array []

4 个答案: