Provider
weather.ts
import { Injectable } from ‘@angular/core’;
import { Http } from ‘@angular/http’;
import ‘rxjs/add/operator/map’;
@Injectable()
export class WeatherProvider {
apikey: ‘71a59f82f0c3de52’;
url;
constructor(public http: Http) {
console.log(‘Hello WeatherProvider Provider’);
this.url =‘http://api.wunderground.com/api/’+this.apikey+’/conditions/q’;
}
getweather(city,state){
return this.http.get(this.url+’/’+state+’/’+city+’.json’)
.map(res => res.json());
}
}
home.ts file
import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { WeatherProvider } from ‘…/…/providers/weather/weather’;
@Component({
selector: ‘page-home’,
templateUrl: ‘home.html’
})
export class HomePage {
weather:any;
location:{
city: String,
state: String
}
constructor(public navCtrl: NavController, private weatherProvider: WeatherProvider) {
}
ionViewWillEnter(){
this.location = {
city:‘miami’,
state: ‘FL’
}
this.weatherProvider.getweather(this.location.city, this.location.state)
.subscribe(weather =>{
this.weather = weather.current_observation;
});
}
}
home.html file
Home <h2 class="location">{{weather.display_location.full}}</h2>
</ion-col>
</ion-row>