How to reload page every time click on tabs?


#1

My problem is when i click on first tab then page reload but when i click second time on same tab means first tab that time page not reload

so i want to give me solution that every time page should reload

please help me


#2

Use the ionViewWillEnter lifecycle event on your page.
You can put the correct code in that method to refresh all the necessary things on your page.

–> https://ionicframework.com/docs/api/navigation/NavController/


#3

Thank you so much @MattE

It works for me


#4

Hi @MattE my view page code is as

<ion-tab [root]=“tab1Root” tabTitle=“My Rx” tabIcon=“ios-medical-outline”>
<ion-tab [root]=“tab2Root” tabTitle=“Search” tabIcon=“search”>
<ion-tab [root]=“tab3Root” tabTitle=“Settings” tabIcon=“ios-settings-outline”>

ion-tabs selectedIndex=“1”

my ts page is ::

import { Component } from ‘@angular/core’;
import { HomePage } from ‘…/home/home’;
import { MyRxPage } from ‘…/my-rx/my-rx’;
import { SettingsPage } from ‘…/settings/settings’;
import { NavController, LoadingController, Select, RadioButton } from ‘ionic-angular’;

@Component({
templateUrl: ‘tabs.html’
})
export class TabsPage {
tab1Root = MyRxPage;
tab2Root = HomePage;
tab3Root = SettingsPage;
constructor(public navCtrl: NavController) {
}
}

Sir, I want in a way that, when I’ll click on any tab, concern page should reload accordingly.
Please help me


#5

Hello, @dilipkumar1007

Just write your main code( that reflect when page loads )inside ionViewWillEnter() in MyRxPage,HomePage,SettingsPage


#6

If there is a sub page of the root page and you navigate back to root page from it, then ionViewWillEnter() is not triggering for me.
Ex: HomePage has button on click it goes to user page. Now if I hit back from user page it will redirect to HomePage but ionViewWillEnter is not getting triggered. This happens only with tabs, for normal pages it is getting triggered.


#7

@cooldp007

Thnx for your kind support, It works for me


#8

Hello, @vasanthb

Please post your home page code


#9
export class HomePage {
ionViewWillEnter(){
//calling an API
}
}

#10

Hello, @vasanthb
it should work


#11

ionViewWillEnter is not triggering for me either.
Someone have a solution ?
Thks.


#12

Show your code lets see what you are doing


#13

In Ionic 4 with Angular router nothing above worked for me. I did find a way through watching the router and catching my tab URL when triggered.

  routerWatch() {
    this.router.events.subscribe(
      (event: NavigationEnd) => {
        if(event instanceof NavigationEnd) {
          if(event.url == '/tabs/(jobs:jobs)')
            this.jobs = null;
            this.getJobs();
        }
      }
    );
  }

#14

Thank you for this! Used your method and it is working for me.

Surely ionViewWillEnter() should fire when coming back to a tab…? I hope the Ionic team addresses this at some point.


#15

You can make a case for this position, but I think it’s miles from “surely”. In any event, as a defensive programmer I think the most prudent approach is to assume nothing about willEnter/willLeave events aside from the fact that they come in pairs: you will never get two of the same kind in a row.