Being new to Angular2 and Typescript, I am currently in the learning phase. I am trying to retrieve data from a REST service and then populate a list with this data obtained from the service. The API link I am using is http://jsonplaceholder.typicode.com/users/1
This is my HttpTestService.ts code;
import {Component} from '@angular/core';
import {Http} from '@angular/http';
import {Headers} from '@angular/http';
import {Observable} from 'rxjs/Observable';
import {Injectable} from '@angular/core';
import 'rxjs/add/operator/map';
@Injectable()
export class HTTPTestService{
constructor(private _http:Http){}
getUser(){
return this._http.get("http://jsonplaceholder.typicode.com/users/1")
.map(res=>res.json());
};
}}
Below is my HttpTestComponent.ts;
import { Component } from '@angular/core';
import {HTTPTestService} from './http-test.service';
import { User } from './user';
@Component({
selector:'http-test',
template:`
<button (click)="onGet()">Get Data</button><br/>
<div>Output:{{getData}}</div><br/>
<button (click) = "onPost()">Post Data</button><br/>
<div>Output:{{postData}}</div><br/>
<button (click) = "onPromiseGet()">Get Data(w Promise)</button><br/>
<div>Output:{{getPromiseData}}</div><br/>
`,
providers:[HTTPTestService]
})
export class HTTPTestComponent{
getData:string;
getPromiseData:string;
postData:string;
constructor(private _httpService:HTTPTestService){}
onGet(){
console.log('Getting user now.');
this._httpService.getUser().subscribe(
data =>this.getData = JSON.stringify(data),
error=>alert(error),
()=>console.log('Finished Get')
);
}}
Also, take a look at my User.ts file below
export class User{
constructor(public id: number,public name:string) { }
}
I am looking for guidance on how to initialize and add items to my User class in order to create a generic list.
Sincere regards