ANGULAR2 Service Get JSON data

In the ANGULAR2 framework of the general Interactive parsing JSON is to use the service, in fact, in addition to the service is still a lot of, today first write the simplest front-end data interaction

Hmm ~ ~

First, I'll create the service directly under the app package.

All right

What about here? Angular2 has a well-encapsulated HTTP interface directly referenced (to, here HTTP seems to have been abolished,, haha I do not know what to change, first use it)

Import {Http} from "@angular/http";

If it's wrong to cite the map times, import use this.

Import ' Rxjs/add/operator/map ';


What's the bottom? This method uses the GetData () to return the JSON address to the HTTP attribute

'/all ' is my JSON address in the background you can use your own if you do not have this address can try Http://jsonplaceholder.typicode.com/posts

Well, in the component class,

Get this service first

Providers: [Serviceservice]


Because the front is used

observable<any>;
So this is the type to be received here.

This.data= This.ss.getData ();
Use this data to receive the value from the service.

It's not over yet remember to import it in module

Import {HttpModule} from "@angular/http";

Imports: [
  Browsermodule,
  HttpModule
],
Forget every time, every time the error

’

In HTML?

<TR *ngfor= "Let item of Data|async" >
  <td>
{{Item.title}}
  </td>

  <td>

  </td>
</tr>
This way, I wrote it casually.
Remember to add |async after acquiring data

Well, probably so, the first time to write Haha, I always forget as a note it

ANGULAR2 Service Get JSON data