从Angular 2中的服务调用Web API

时间:2016-01-08 06:46:44

标签: angular typescript

我使用的是Angular 2.0 beta版。我需要从服务中调用Web API。但我没有得到任何解决方案。

mobileService.ts

import {Http, Headers, HTTP_PROVIDERS} from 'angular2/http';
import {Injectable} from 'angular2/core';
import {Observable} from 'rxjs/Observable';
import { Mobile } from './datatypes/Mobile';

@Injectable()
export class MobileService {          
     constructor(public http: Http) {     
        this.http = http;
        }

getMobiles() {        
    // return an observable
    return this.http.get("api/ElectronicsAPI/Get")
        .map((responseData) => {
            return responseData.json();
        })
        .map((mobiles: Array<any>) => {
            let result: Array<Mobile> = [];
            if (mobiles) {
                mobiles.forEach((mobile) => {
                    result.push(
                        new Mobile(mobile.name,
                            mobile.price));
                });
            }
            return result;
        });
}
}

错误是,

  • this.http.get(...)。map不是函数

此外,我还有一些与此主题相关的问题。在那里,他们提到将map导入为

  • 导入'Rxjs / add / operator / map'

但是我怎么能在TypeScript中做到这一点?

有没有其他方法可以为地图功能导入插件?

boot.ts

import {bootstrap}    from 'angular2/platform/browser';
import {ROUTER_PROVIDERS} from 'angular2/router';
import {AppComponent} from './app.component';
import {HTTP_PROVIDERS} from 'angular2/http';

bootstrap(AppComponent,[ROUTER_PROVIDERS,HTTP_PROVIDERS]);

1 个答案:

答案 0 :(得分:1)

您可以在mobileService.ts文件中使用以下内容:

import 'Rxjs/add/operator/map'

此导入应在使用map方法的地方完成。

以下答案也可以为您提供帮助:

希望它可以帮到你, 亨利