Angular 2 应用程序中未调用服务

Question

我是 Angular 2 的新手，在呼叫服务方面需要帮助。

这是我制作的 Plnkr：

https://plnkr.co/edit/wss2Jy41pYyjQUOk47es?p=preview

Put code here

Answer 1

首先，确保您已将 HttpModule 导入并包含在您的 ngModule 中。

其次，你不能像这样显示你的profile：

{{profile}}

因为您的个人资料具有 username 等属性

否则你的代码看起来还不错。由于您的 json 看起来像这样：

{
  "profile":
    {
      "username":"eric",
      "bio":"Cofounder of Thinkster.io, kinda looks like Peeta from the Hunger Games",
      "image":"http://i.imgur.com/S66L2XZ.jpg",
      "following":false
    }
}

我会像这样映射传入数据：

.map((res: Response) => res.json().profile);

这样您就可以使用一个整洁的对象：

{
  "username": "eric",
  "bio": "Cofounder of Thinkster.io, kinda looks like Peeta from the Hunger Games",
  "image": "http://i.imgur.com/S66L2XZ.jpg",
  "following": false
}

然后您可以使用您的属性显示您的个人资料，例如：{{profile.username}}

这是一个plunker

Angular 2 应用程序中未调用服务

Service is not being called in Angular 2 application

angular

angular2-services