How to get only some informations from json response?

Openweatherapi returns json like this:

{"coord":{"lon":-0.13,"lat":51.51},"weather":[{"id":300,"main":"Drizzle","description":"light intensity drizzle","icon":"09d"}],"base":"stations","main":{"temp":280.32,"pressure":1012,"humidity":81,"temp_min":279.15,"temp_max":281.15},"visibility":10000,"wind":{"speed":4.1,"deg":80},"clouds":{"all":90},"dt":1485789600,"sys":{"type":1,"id":5091,"message":0.0103,"country":"GB","sunrise":1485762037,"sunset":1485794875},"id":2643743,"name":"London","cod":200}


But i need only informations for class like this:

export class WeatherInfo{
constructor(
public name: string,
public description: string,
public temperature: number){
this.name = name;
this.description = description;
this.temperature = temperature;


}


}

This is my api service:

import { Injectable } from '@angular/core';
import { HttpClient, HttpParams } from '@angular/common/http';
import {environment} from '../environments/environment';
import { Observable } from 'rxjs';

@Injectable({
providedIn: 'root'
})
export class ApiService {

constructor(private http: HttpClient) { }

getWeatherByCity(city): Observable<any>{
const httpParams: HttpParams = new HttpParams().set('q',city).set('appid',environment.ApiKey).set('units',environment.ApiUnits);

return this.http.get(environment.ApiUrl, {params: httpParams});

}

private handleError (error: any) {
let errMsg: string;
errMsg = error.message ? error.message : error.toString();

console.error(errMsg);
return Observable.throw(errMsg);
}
}


I can see the response in console log, but i cant display it in the browser



And my app.component.class
import { Component, OnInit } from '@angular/core';
import { ApiService } from './api.service';
import { WeatherInfo } from './weather-info';

@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

weather: WeatherInfo;

data: string;

title = 'Pogoda';

constructor(private api: ApiService) {}

ngOnInit(){
this.getWeather();
}

getWeather(){
this.api.getWeatherByCity('Bydgoszcz').subscribe(
res => {
this.data = res;
console.log(this.data);
}
);
}


My goal is to get json data and parse it to the weather-info object. I need only information in this class.

Continue reading...