我也在尝试编写一个非常基本的Weather应用程序，该应用程序从该API https://openweathermap.org/api中提取数据。当我也单击链接时，也要从home.html文件中转到weatherData.html，则什么也没有显示，而且我似乎也无法在代码中查明问题所在，任何帮助将不胜感激。

<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title>
      Weather Ireland
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
  <ion-header collapse="condense">
    <ion-toolbar>
      <ion-title size="large">Weather Ireland</ion-title>
    </ion-toolbar>
  </ion-header>

  <a class="button icon-right ion-plus-round" href="../weather-data/weather-data.page.html">weatherData</a>
</ion-content>

这是homepage.html的代码，该代码也链接了weatherData.html文件，应该在该文件中打印来自API的信息。

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)=>{
      console.log(data);
      this.weather = data['weather'];
    }
    )
  }
}

这是data.html文件的代码

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,declarations: [WeatherDataPage]
})
export class WeatherDataPageModule {
  weather;

  constructor(private weatherdataservice: WeatherDataService){}
  ngOnInit(){
    this.weatherdataservice.getWeather().subscribe((data)=>{
      console.log(data);
      this.weather = data['weather'];
    }
    )
  }
}

这是data.module.ts文件的代码

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}&lon={8.63}&appid={fec30507acb533f670080ab3174f226f}')
  }

}

这是data.services ts文件的代码。