Question

我正在尝试使用Angular 2从Statbureau通胀api- https://www.statbureau.org/en/inflation-api检索数据。我开始测试我的api并确保它在控制台中输出成功消息。看来我正在使用的api是JSONP，因为我正在使用的JSON地址 http://www.statbureau.org/calculate-inflation-price-jsonp?jsoncallback=？在网站上他们提供了一个JS小提琴，它成功地调用了api使用jquery。当我尝试在Angular 2中进行相同的调用时，我得到以下错误：

TypeScript error: C:/Users/Rennie/projects/inflator/app/pages/home/home.ts(22,13): Error TS
2322: Type 'Observable<any>' is not assignable to type 'HomePage'.
  Property 'jsonp' is missing in type 'Observable<any>'.
TypeScript error: C:/Users/Rennie/projects/inflator/app/pages/home/home.ts(22,13): Error TS
2409: Return type of constructor signature must be assignable to the instance type of the c

这是我的代码

import {Component} from '@angular/core';
import {NavController} from 'ionic-angular';
import {Jsonp, URLSearchParams } from '@angular/http';
import {Observable} from 'rxjs/Rx';
import 'rxjs/add/operator/map';
@Component({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {


  constructor(private jsonp: Jsonp) {

    this.jsonp=jsonp;
        let cpiUrl = "https://www.statbureau.org/calculate-inflation-price-jsonp?jsoncallback"
         let params = new URLSearchParams();
      params.set('country', 'united-states');
      params.set('amount', '102');
        params.set('start', '1968/1/1');
        params.set('finish', '2016/1/1');
        // TODO: Add error handling
        return this.jsonp
               .get(cpiUrl, { search: params }).map(function(response){ return response.json(); })

    }


}

我的代码与jsfiddle中的调用不同，因为我对api参数进行了硬编码，以便快速查看结果。

Answer 1

1）构造函数通常（总是？）没有return语句。删除返回语句应处理type 'Observable<any>' is not assignable to type 'HomePage'.

2）get中的Jsonp课程似乎没有方法Angular 2检查docs。

3）在订阅（它们是懒惰的）之前不会执行可观察的序列/管道，所以即使该代码确实编译了，也不会执行请求。

4）我认为你应该看看this类似的问题。

祝你好运。

Http获取Angular 2中的请求

1 个答案: