标签数据未​​在ionic 4中加载动态数据

Question

嗨，我是Ionic的新手，我正在使用Tabs实现Ionic App。在我的应用中，有三个标签，每个标签包含每个组件并带来动态数据（Rest API调用）。

但是只有第一次它有数据，下次单击选项卡数据时不会更新（Rest API调用未调用），因为我写了ngOninIt()方法。

下面是我的代码：

tabs.html代码：

<ion-tabs>
  <ion-tab label="Home" icon="home" href="/tabs/(home:home)">
    <ion-router-outlet name="home"></ion-router-outlet>
  </ion-tab>
  <ion-tab label="About" icon="information-circle" href="/tabs/(about:about)">
    <ion-router-outlet name="about"></ion-router-outlet>
  </ion-tab>
  <ion-tab label="Contact" icon="contacts" href="/tabs/(contact:contact)">
    <ion-router-outlet name="contact"></ion-router-outlet>
  </ion-tab>
</ion-tabs>

tabs.routing.ts

    const routes: Routes = [
      {
        path: 'tabs',
        component: TabsPageComponent,
        children: [
          {
            path: 'mustang',
            outlet: 'tab1',
            loadChildren: './mustang/mustang.module#MustangModule'
          },
          {
            path: 'camaro',
            outlet: 'tab2',
            loadChildren: './camaro/camaro.module#CamaroModule'
          },
          {
            path: 'charger',
            outlet: 'tab3',
            loadChildren: './charger/charger.module#ChargerModule'
          }
        ]
      },
      {
        path: '',
        redirectTo: '/lazy-load-tabs/tabs/(tab1:mustang)'
      }
    ]

;

home.module.ts

import { IonicModule } from '@ionic/angular';
import { RouterModule } from '@angular/router';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { HomePage } from './home.page';

@NgModule({
  imports: [
    IonicModule,
    CommonModule,
    FormsModule,
    RouterModule.forChild([{ path: '', component: HomePage }])
  ],
  declarations: [HomePage]
})
export class HomePageModule {}

home.page.ts

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss']
})
export class HomePage implements OnInit {

  constructor() { }

  ngOnInit() {
    alert("app home tabs is clickced...");
  }
}

但是在上述警报方法仅调用一次的情况下，我可以在哪里编写每次单击选项卡时应调用的代码。

预先感谢!!!!!

Answer 1

您可以使用其他每次调用的生命周期事件，例如ionViewWillEnter

有关更多详细信息，请参见 https://ionicframework.com/docs/api/navigation/NavController/