Angular 17 Subject behavior issue

It seems like you are facing a sync issue with the authentication state. When you refresh the page, the application reloads and fetches the correct authentication state. 

To resolve this issue, you can try the following approaches:

1. Store the authentication state in local storage:
    - When the user logs in, store the authentication state in local storage.
    - When the application initializes, check if there is any authentication state in local storage and update the authentication service accordingly.

2. Use a route guard:
    - Create a route guard that checks if the user is authenticated before navigating to a protected route.
    - Update the authentication state in the route guard based on the user's authentication status.

3. Use a resolver:
    - Create a resolver that fetches the authentication state before initializing a component.
    - Update the authentication state in the resolver based on the user's authentication status.

By implementing one of these approaches, you should be able to ensure that the authentication state is synchronized across the application and it reflects correctly in your isLoggedIn$ observable.

First time not console.log  if refresh the page console.log working

this.isLoggedIn$.subscribe((x) => { console.log(x)});