Where to save data in Angular where it can be accessed from anywhere and, when changing it, update component

Asked

Viewed 115 times

0

Good people, my question may be really stupid, but it’s because I’m studying about Angular and how to use it. I wonder where I can save data that, by changing it, I can recover anywhere in the system and also update the component. For example

I have a page that is the home-page, within it I have the menu and the option to select the company where the user is logged in. When that company changes on my dropdown button, I’d like the data on mine updated. To try to explain better what I would like, I will post the following code from my "home.html"

Here, on my home.html page, I select an establishment:

    <button mat-button [matMenuTriggerFor]="menuEstab">
        <i class="material-icons md-36">store</i>
        {{estabelecimento.nomeFantasia}}
    </button>
    <mat-menu #menuEstab="matMenu">
        <ng-container *ngFor="let estab of estabelecimentos">
            <button mat-menu-item (click)="changeEstab(estab)">
                <i class="material-icons md-18">business</i>
                {{estab.nomeFantasia}}
            </button>
        </ng-container>
    </mat-menu>

Today, when selecting which establishment I want to use for the user who is logged in, I saved in sessionStorage:

  public changeEstab(estab: Estabelecimento) {
    this.estabelecimento = estab;
    sessionStorage.setItem(environment.currentEstab, JSON.stringify(estab));
  }

However, my component that is in the center of the page, does not know that the establishment has been changed, but I need to know.

<mat-sidenav-content>
    <router-outlet></router-outlet>
</mat-sidenav-content>

I don’t know if I could explain myself properly, but what’s the best way to do that?

Thank you.

  • It really wasn’t very clear your question man.

  • Because it is... what I want is to save the data of the logged in user in one place and be able to recover them in any other component, and, when this data changes, that my component knows that I need to update to perform new searches.

  • I mean, what you’re looking for is a database.

  • @Leandrade doesn’t... I want my application to have access to that single instance, single object, as if it were a Singleton. Some pages depend on the content of this English and, when it changes, these pages need to be updated. When it is changed: In my mat-Toolbar that is displayed throughout the application there is the possibility to change the current issuer, when changing, the page that is visible, must update with the selected establishment.

1 answer

0


Good people, I’m studying on my own and I think I skipped a few steps before I started implementing the software. To solve my problem I started using Ngrx. This approach is new to me, but after studying it a lot, I implemented and solved my problem.

Thank you all.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.