Question

我修改了英雄教程，我正在使用rest api调用真正的http服务器，而不是教程中使用的模拟服务。

其余的api返回以下有效负载：

[
  {
    "id": 1,
    "comment": "hackathon"
  }
]

我的服务类中用于获取英雄的代码看起来像这样并且完美运行：

  getHeroes():Promise<Hero[]> {
    return this.http.get(this.url)
        .toPromise()
        .then(response => response.json().data)
        .catch(this.handleError);
  }

在我调整真正的http服务的改编类中，我必须使用以下代码才能正常工作（例如我的列表包含有效负载项）。

  getItems():Promise<Item[]> {
    return this.http.get(this.url)
      .toPromise()
      .then(response => {
        response.json().forEach(item => {
          this.entries.push(item);
        });
        return this.entries;
      })
      .catch(this.handleError);
  }

我不清楚为什么必须使用以下解决方法：

    response.json().forEach(item => {
      this.entries.push(item);
    });
    return this.entries;

而不是仅使用与模拟服务器的英雄教程相同的代码。如果我使用英雄教程中的部分，结果是一个空的条目列表。

Answer 1

在您的服务类中，您可以使用此方法：

getItems():Promise<Item[]> {
  return this.http.get(this.url)
   .toPromise()
   .then(response => response.json().data)
   .catch(this.handleError);
}

在您使用此服务类的组件中，例如：

// import your service class...
// import OnInit...

export class AppComponent implements OnInit {
  entries: any[];

  constructor(private service: Service){}

  ngOnInit() {
   this.service.getItems().then(
    entries => this.entries = entries
   )
  }
}

Angular2：为什么在http休息调用后需要额外的提取？

1 个答案: