Update ionic component view across app through settings page

@adityaketkar wrote:

I am working on an app, which has an ionic component with the temperature of surroundings. This detail is fetched from TemperatureService I created.

Now, in the settings tab, I need the ability to change between Celcius and Fahrenheit and this change should reflect all across the app wherever the component is used.

The HTML file for the page has the component included like this :

<ion-col> 
        <app-temperature-meter></app-temperature-meter>
</ion-col>

And the temperature is fetched from service in this way :

ngOnInit() {
    this.loadedEnvironment = this.currentPlace.getEnvironment();
    this.temperatureToShow = this.tempCtrl.toCurrentUnit(this.loadedEnvironment.currTemp);
  }

where tempCtrl is the service and toCurrentUnit() converts the input temperature to the temperature in current units (C or F).

The problem here is that since the temperatureToShow is determined during ngOnInit , it does not dynamically change when I change the settings in my settings page.

Already Tested : Since this component is used on multiple pages, I have checked the correct functioning of the service and ngOnInit function. They seem to work (ie. if a page is loaded the first time and ngOnInit is called, the temperature shown is in the currently required units)

Expectations : Is there something similar to ionViewWillEnter for components, such that whenever they are on the screen, I can check for the current temperature units from service and change the view accordingly

Posts: 2

Participants: 2

Read full topic