Show initial user setup component only on first login

Question

I have 2 components intial-settings and app-navbar inside my app.component.html:

<initial-settings *ngIf="!userFloor"></initial-settings> <app-navbar *ngIf="userFloor"></app-navbar>

And my app.component.ts:

export class AppComponent {
  public userFloor;

  constructor(private userFloorService: UserFloorService){}

  ngOnInit(){
    this.userFloorService.getJSON().subscribe(
      data => this.userFloor = data);
  }
}

I want to show intial-settings component only on first user login, so the user can setup some things. On all of the next user logins, the app should show the second app-navbar component right away, beacuse user has alerady set up those required things, and they are stored in database.

So, i use service to get the data. If the data is empty, which means user is loging in for the first time, show the initial-setting component. After the data is saved, redirect to the app-navbar component. If the data is not empty show the app-navbar component.

My question is, how to implement this logic, that means which is the best way to show/hide these 2 components and how to redirect from the intial-settings component to the app-navbar component after user saves the required setup data.

I think i need to use router with router guards but i didn't find any example of this use case, which i would understand clearly enough. I am new to Angular, thanks!

Answer 1

using angular routing You can create a function for This logic ! like...

app.component.ts

import { Router, ActivatedRoute } from '@angular/router';
export class AppComponent {
      public userFloor;
    
      constructor(private userFloorService: UserFloorService, private router: Router,){}
    
      ngOnInit(){
        this.userFloorService.getJSON().subscribe(
          (data) =>{ 
          if(data.length){
            this.router.navigate(['/PAGE-PATH']);
          }else {
            this.router.navigate(['/PAGE-PATH']);
           }
          });
         }
       }

hope it will usefull for all !