Question

鉴于我是angular 2.0的新手。我在此页面上看过Heroes示例https://angular.io/docs/ts/latest/tutorial/，需要将此示例转换为使用实时API。我已创建API并且已启用跨源请求，并且它具有与内存Web API中相同的结构。

我尝试过以下事情，让它运转但没有运气。

更新了hero.service.ts中的getHeroes（）函数，如下所示 -

getTeams(): Promise<Hero[]> {
        this.http.get('api/heroes')
          .map()
          .then((res: Response) => {
          console.log('RES: ', res);
        }).catch(this.handleError);

        return this.http.get('api/heroes')
                    .toPromise()
                    .then(response => response.json().data as Hero[])
                    .catch(this.handleError);
    }

现在上面的代码在控制台中打印数据。

但现在我更新了＃api.heroes＆＃39;使用api URL和第一个http并从app.modules.ts中删除以下行

import { InMemoryWebApiModule }     from 'angular-in-memory-web-api';
import { InMemoryDataService }      from './in-memory-data.service';
InMemoryWebApiModule.forRoot(InMemoryDataService),

但它说找不到404网址。

我不确定如何实施它。

Answer 1

import 'rxjs/Rx';
import { Http, Response } from '@angular/http';

导入上述内容并调整您的功能。

getTeams(){
        this.http.get('http://api/heroes')
                    .map((response: Response) => response.json())
                    .catch(this.handleError)
                    .subscribe((data)=> {

                      // your code here for the data

                      console.log(data)
                     });
    }

假设您已在构造函数中启动了Http，并且您的get API为http://api/heroes，这应该可以正常工作

在角度2.0中的Heroes示例中使用实时API需要进行哪些更改

我尝试过以下事情，让它运转但没有运气。

1 个答案: