How to call a service function in the app.component.ts file?

Hi all,

I have implemented the following service that gets information from capacitor storage.

export class StartupService {

  public myActiveEntityDesc: BehaviorSubject<any> = new BehaviorSubject<any[]>([]);
  public myActiveEntityID: BehaviorSubject<any> = new BehaviorSubject<any[]>([]);
  
  constructor() { }
  
  async getActiveEntity() {
    Plugins.Storage.get({key: 'activeEntityDesc'}).then((data) => {
      this.myActiveEntityDesc.next(data);
    });
    Plugins.Storage.get({key: 'activeEntityID'}).then((id_data) => {
      this.myActiveEntityID.next(id_data);
    });
  }
}

and when I use this in a separate page, it all works great and updates as this value changes. Here is the code for a separate page:

    this.startupService.getActiveEntity();
    this.startupService.myActiveEntityDesc.subscribe((data) => {
      this.retrievedEntityDesc = data;
    });
    this.startupService.myActiveEntityID.subscribe((id_data) => {
      this.retrievedEntityID = id_data;
    });

Now I have a menu defined in the app.component.ts file and I would like to display the Entity Name on the Menu.
Initially I call the function within the initializeApp() section, which works fine when the app loads and it gets the correct values, BUT… if this value changes it does not update in the Menu.

My suspicion is because this actually only runs once on App initialization.
My question is how or where do I need to call this function then so that it will update where it is displayed on the menu everytime this value is changed keeping in mind that I do want to be careful of not running queries or calls on every single page?

Any suggestions?

1 post - 1 participant

Read full topic