未从Web调用API

Question

作为练习，我正在尝试从API调用一些数据来构建一个基本的天气应用程序。

我在chrome浏览器上使用inspect元素来查看控制台是否会在日志中显示我的数据，但无济于事。

我遇到了一个障碍，我觉得我只是遗漏了一些代码或做了一些小错误。任何帮助都将不胜感激。

下面的代码来自我的weather.ts提供程序

constructor(public http: HttpClient)
  {
    console.log('Hello WeatherProvider Provider');
    //this.url = 'http://api.openweathermap.org/data/2.5/weather?q=dublin,Ireland&APPID=b90245073a8392aec69a261861286c3b';

  }

  // getting weather info from API with a custom city and country
  getWeather(city, country):Observable<any> 
  {
    return this.http.get('https://api.openweathermap.org/data/2.5/weather?q='+city+','+country+'&APPID='+this.apiKey);
  }

}

构造函数中的console.log出现在控制台中，但没有其他内容。

下面的代码来自我的home.ts页面

export class HomePage
{
  weather: any;
  location: 
  {
    city: string,
    country: string
  }

  constructor(public navCtrl: NavController, private weatherProvider:WeatherProvider) 
  {

  }

  ionWillEnter()
  {
    this.location = {city: 'dublin', country: 'Ireland'}

    this.weatherProvider.getWeather(this.location.city, this.location.country).subscribe(weather => {
      console.log(weather);
    });
  }

}

天气(console.log)；是我的终极目标。以使其按预期显示在控制台中。

Answer 1

您拼写错误的生命周期方法名称。

您可能希望使用ionViewWillEnter或ngOnInit

Answer 2

Angular有生命周期方法。NgonInit最初将被调用，因此您需要将您的代码放入onInit方法中。请参阅此处的其他生命周期挂钩https://angular.io/guide/lifecycle-hooks