Angular Singleton Injectable service is not working

Question

I have a service that I set as injectable that has a property that I want to share between two components. each component has a separate route

here is my service:

import { Injectable } from '@angular/core';
import { OAuthService, JwksValidationHandler } from 'angular-oauth2-oidc';
import { authConfig } from './sso.config';
import { HttpClient} from '@angular/common/http';

@Injectable({
providedIn: 'root'
})
export class AuthorizeService {

private isAuth: boolean;

constructor(private oauthService: OAuthService, private http: HttpClient) {
    console.log('init services');
}

 setIsAuth(value: boolean)
 {
  this.isAuth = value;
 }

 getIsAuth()
 {
   return this.isAuth;
 }
}

The properly I want to share is isAuth I added the service as a provider to the app.model.ts

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    LoginComponent
  ],
  imports: [
    BrowserModule,
    RouterModule,
    AppRoutingModule,
    HttpClientModule,
    OAuthModule.forRoot()
  ],
  providers: [{
    provide: HTTP_INTERCEPTORS,
    useClass:TokeInterceptorService,
    multi: true
  }, AuthorizeService],
  bootstrap: [AppComponent]
})
export class AppModule { }

here are the 2 components 1. home component which sets the value to true

import { Component, OnInit } from '@angular/core';
import { AuthorizeService} from '../authorize.service'

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {

  constructor(private authorizeService: AuthorizeService) { }
  ngOnInit() {
    this.authorizeService.setIsAuth(true);
  }
}

2. second component the login component just displays the value of isAuth at the moment.

import { Component, OnInit } from '@angular/core';
import { AuthorizeService} from '../authorize.service'

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {

  constructor(private authorizeService: AuthorizeService) { 

  }
  ngOnInit() {  
    console.log('is auth ', this.authorizeService.getIsAuth());
  }
}

is there a specific way to navigate from the home component to the login component in order for the service not to get re-initialized again?

because when I navigate to localhost:4200/login the isAuth is reset and the service is re-initialized.

I am trying to implement OpenIdConnect authentication and the /login component is my URI redirect so I want to make sure that my authorization properties are global across my app.

I might be missing something can you plase help?