Problems with save in angular 7

I don't know if you have already generated all the necessary files or what structure you want to have in the project. I always have a guard and an authentication service, these are the commands to generate them:

• Guard:

ng generate guard auth

• Services:

ng generate service auth

auth.service.ts :

I always create all of the app's authentication methods here, such as login, registration, logout, etc.

export class AuthService {

  isLoggedIn: boolean;

  constructor() {
    this.isLoggedIn = false;
  }

  signIn() {
    // Aquí las comprobaciones que tengas que hacer con la base de datos si es usuario o no
    this.isLoggedIn = true;
  }

  signOut() {
    this.isLoggedIn = false;
  }
}

auth.guard.ts :

Here the guard checks if it is logged in or not, every time someone tries to enter a route that has the canActivate: [AuthGuard].

export class AuthGuard implements CanActivate {

  constructor(private auth: AuthService, private router: Router) { }

  canActivate(): boolean {
    if (!this.auth.isLoggedIn) {
      this.router.navigate(['/login']); // Si es falso lo devuelve a la página login o a la que tu quieras
      return false;
    }
    return true;
  }

}

app-routing.module.ts :

const routes: Routes = [
  { path: '', redirectTo: '/login', pathMatch: 'full' },
  { path: 'login', component: LoginComponent },
  { path: 'page1', component: Page1Component, canActivate: [AuthGuard] },
  { path: 'page2', component: Page2Component, canActivate: [AuthGuard] },
  { path: '**', redirectTo: '/login' }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Then in the you call the del login.component.tsmethod .signIn()auth.service.ts

I hope I've helped. Cheers

I have done similar as indicated by Pacne, it works normally for me, there is only a small fix, I navigate in my rtuas, daughter rytas, etc, all validated with localStorage, and obtaining services from a backend, but if for example I am in a daughter route (route child), and I give it f5, (my guard if it validates that it is authenticated as admin or another role, as I mention when I navigate), but for example I go to the dashboard (which is a route child), and I give it f5, the guard it sends the null roles, I give f5 again and now if it detects me, which I think as soon as it loads the document, it first looks for the guard before accessing the component, that's why it comes out empty, although it shouldn't, since in the auth.isLoggedIn (analogous to mine), I ask for localStorage, but it gives me null, as I said it is solved with an f5, but that should not happen, I don't know if you have an idea or something more specific to look for.thanks greetings