Angular подписаться, не возвращая логическое значение?

Question

У меня проблемы с наблюдаемыми в Angular. Думаю, я либо что-то упускаю, либо не понимаю. Я пытаюсь отследить, вошел ли пользователь в систему или нет. Для этого у меня есть AuthService с логическим значением для отслеживания аутентификации пользователя. Ниже у меня очень простая версия AuthService, и я пытаюсь изменить аутентифицированное логическое значение. Но это изменение не отражается ни на одном компоненте. Я убедился, что значение услуги изменяется, но это изменение не передается никому из подписчиков.

AuthService.ts

import { Injectable } from '@angular/core';
import { of, Observable } from 'rxjs';

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

  authenticated: boolean = false;
  access_token: string;

  constructor() { }

  isAuthenticated(): Observable<boolean>{
    return of(this.authenticated);
  }

  toggleAuthenticate(): void{
    this.authenticated = !this.authenticated
  } 

}

LoginComponent.ts

import { Component, OnInit, ElementRef, ViewChild } from '@angular/core';
import { GoogleauthService } from 'src/app/services/googleauth/googleauth.service';

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

  auth2: any;
  public authenticated: boolean;

  constructor(private googleAuthService: GoogleauthService) { }

  @ViewChild('loginRef', {static: true }) loginElement: ElementRef;

  ngOnInit(): void {
    // this.googleSDK();
    this.getAuthenticated();
  }

  getAuthenticated(): void{
    this.googleAuthService.isAuthenticated().subscribe((bool) => {this.authenticated = bool;});
  }

  Authenticate(): void{
    this.googleAuthService.authenticated = !this.googleAuthService.authenticated;
    // this.googleAuthService.toggleAuthenticate();
  }

}

LoginComponent. html

<div class="container mt-5">
    <h2>{{authenticated}}</h2>
    <div class="row mt-5">
      <div class="col-md-4 mt-2 m-auto ">
          <!-- <button class="loginBtn loginBtn--google" #loginRef>
              Login with Google
          </button> -->
          <button (click)="Authenticate()">
            Authenticate
          </button>
      </div>    
    </div>
</div>

Answer 1

Поскольку varable аутентифицирован без изменений остается ложным и подписка не возвращает значение и не использует функцию void, этот тип не возвращает значение.

Использовать localStorage этот метод лучше всего проверять, есть ли у пользователя логин или нет.

login(email,password){
this.fbAuth.signInWithEmailAndPassword(email,password)
    .then(async user =>{
 await localStorage.setItem('userData', JSON.stringify(user)) 
})
//your code 
}

isAuthenticated()(){
  const luserData = localStorage.getItem('userData');
   return suserData !==null  ? true : false 
}

logout() {
    localStorage.removeItem('userData');
    localStorage.clear();
    //your code  
    );   
}

Надеюсь, это поможет.