Service is not being called in Angular 2 application

Question

I am new to Angular 2 and need help in calling service.

Here is the Plnkr I made:

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

Put code here

Answer 1

First of all, make sure you have the HttpModule imported and included in your ngModule.

Second, you cannot display your profile just like:

{{profile}}

since your profile has properties like username etc.

Otherwise your code looks pretty good. Since your json looks like this:

{
  "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
    }
}

I would map the incoming data like so:

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

so you get a neat object to work with:

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

Then you can display your profile with your properties, e.g like: {{profile.username}}

Here's a plunker