Skip to content Skip to sidebar Skip to footer

How To Change Variable From Another Page Ionic4

I'm creating a simple tabs-based app in Ionic4, and I want to change a variable in the main tabs page, where tabs switcher is shown, from the first tab, and I want to change this v

Solution 1:

NOTE: Events Library is now deprecated and not working in ionic 4+. You should switch to Observables.

Check my Update Answer: Update Variable on other page via Observable

Old Answer:

Your can use Event library in ionic for real time Variable Updates:

in your tab1.page.ts

import { Events } from'@ionic/angular';

    exportclassTab1implementsOnInit {
      constructor(public events: Events) { }
      
      publishEvent(){
        console.log('shouldPublishEvent');
        this.events.publish('testevent', {key: 'value'});
      }
    }

In your tabs.page.ts

import { Events } from'@ionic/angular';
    exportclassTabPageimplementsOnInit {
      constructor(public events: Events) { }
      ngOnInit(){
        this.events.subscribe('testevent', (data) => {
          console.log('testevent');
          console.log(data);
        });
      }
    }

Solution 2:

I'll probably get slammed for this, but anotherdifferent way you can do it is to have a "globals.ts" file that just handles variables that need to be accessed from multiple pages.

Just import that globals file on each page that needs those variables.

import { GlobalsProvider } from'../providers/globals/globals'; 

constructor(public platform: Platform,
      public globalvals: GlobalsProvider)

Then you can call them on each page...

this.globalvals.setting = true;

Post a Comment for "How To Change Variable From Another Page Ionic4"