title: Issue printing api weather data too a html page
body: <p>I am trying too code a very basic Weather app that pulls data from this API <a href="https://openweathermap.org/api" rel="nofollow noreferrer">https://openweathermap.org/api</a>. When  I click the link too go from the home.html file too the weatherData.html nothing is showing up and I cant seem too pinpoint the issue within my code,any help would be appreciated.</p>
  
  <pre><code>&lt;ion-header [translucent]="true"&gt;
    &lt;ion-toolbar&gt;
      &lt;ion-title&gt;
        Weather Ireland
      &lt;/ion-title&gt;
    &lt;/ion-toolbar&gt;
  &lt;/ion-header&gt;
  
  &lt;ion-content [fullscreen]="true"&gt;
    &lt;ion-header collapse="condense"&gt;
      &lt;ion-toolbar&gt;
        &lt;ion-title size="large"&gt;Weather Ireland&lt;/ion-title&gt;
      &lt;/ion-toolbar&gt;
    &lt;/ion-header&gt;
  
    &lt;a class="button icon-right ion-plus-round" href="../weather-data/weather-data.page.html"&gt;weatherData&lt;/a&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p>This is the code for the homepage.html which links too the weatherData.html file where the information from the API is supposed to be printed.</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { FormsModule } from '@angular/forms';
  
  import { IonicModule } from '@ionic/angular';
  
  import {WeatherDataService} from '../weather-data.service'
  
  import { WeatherDataPageRoutingModule } from './weather-data-routing.module';
  
  import { WeatherDataPage } from './weather-data.page';
  
  
  
  @NgModule({
    imports: [
      CommonModule,
      FormsModule,
      IonicModule,
      WeatherDataPageRoutingModule
    ],
    declarations: [WeatherDataPage]
  })
  export class WeatherDataPageModule {
    weather;
  
    constructor(private weatherdataservice: WeatherDataService){}
    ngOnInit(){
      this.weatherdataservice.getWeather().subscribe((data)=&gt;{
        console.log(data);
        this.weather = data['weather'];
      }
      )
    }
  }
  </code></pre>
  
  <p>This is the code for the data.html file</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { FormsModule } from '@angular/forms';
  
  import { IonicModule } from '@ionic/angular';
  
  import {WeatherDataService} from '../weather-data.service'
  
  import { WeatherDataPageRoutingModule } from './weather-data-routing.module';
  
  import { WeatherDataPage } from './weather-data.page';
  
  
  
  @NgModule({
    imports: [
      CommonModule,
      FormsModule,
      IonicModule,
      WeatherDataPageRoutingModule
    ],
    declarations: [WeatherDataPage]
  })
  export class WeatherDataPageModule {
    weather;
  
    constructor(private weatherdataservice: WeatherDataService){}
    ngOnInit(){
      this.weatherdataservice.getWeather().subscribe((data)=&gt;{
        console.log(data);
        this.weather = data['weather'];
      }
      )
    }
  }
  </code></pre>
  
  <p>this is the code for  the data.module.ts file</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { HttpClient} from '@angular/common/http'
  
  
  @Injectable({
    providedIn: 'root'
  })
  export class WeatherDataService {
  
    APIKey = 'fec30507acb533f670080ab3174f226f';
  
  
    constructor(private httpClient: HttpClient) { }
  
    public getWeather(){
    return this.httpClient.get('api.openweathermap.org/data/2.5/weather?lat={53.87}&amp;lon={8.63}&amp;appid={fec30507acb533f670080ab3174f226f}')
    }
  
  }
  </code></pre>
  
  <p>this is the code for the data.services ts file.</p>