Anubhav Sahu
Anubhav Sahu

Reputation: 71

Can't handle api response by get method in angular2?

i have been trying to get response from an api (http://www.cricapi.com/how-to-use.aspx) with angular2. i don't know what i am doing wrong? here's my code--

//matchlist.component.ts
@Component({
selector: 'match-list',
template: `
    <ul>
    <li *ngFor="let m of matches">
    <p>{{m.title}}</p>
    </li>
    </ul>

`,
providers: [MatchListService]
})

export class MatchList implements OnInit{

matches: Match[] = [];
object: any;
constructor(private matchservice: MatchListService){
}

ngOnInit(){

    this.matchservice.getMatchList()
        .subscribe(
            matches => this.matches = matches,
            err => {} 
          );

 }
}

here's my service class-

 @Injectable()
 export class MatchListService{

private matchListUrl = 'http://cricapi.com/api/cricket/';

constructor (private http: Http) {

}

getMatchList(): Observable<Match[]>{
    return this.http.get(this.matchListUrl, [{}])
                    .map((res:any) => res.json()
                      .catch(this.handleError));
            }

please tell me if i am doing it the wrong way? this is my first ex with api!

Upvotes: 0

Views: 93

Answers (1)

johan
johan

Reputation: 1012

I'm not sure what language you are trying to code in but with regular angular you simply assign the JSON returned result to a variable and it will hold the complete JSON object like so:

$scope.data = [];
$http({url: url}).then(function (rs) {
    console.log(rs);
    $scope.data = rs.data;
});

Upvotes: 1

Related Questions