AuthState

ngOnInit(): void {
    this.auth.authState.subscribe((user) => {
      if (user) {
        console.log('State: You are logged in!');
      } else {
        console.log('State: You are logged out!');
      }
    });
}

Service

Az alábbi lépéseket kell követned, hogy ezt a funkcionalitást egy szolgáltatásban (service) valósítsd meg és hívd meg más komponensekből:

1. Hozd létre a Szolgáltatást:

Használd az Angular CLI-t a szolgáltatás létrehozásához:

ng generate service auth-state

2. Valósítsd meg a szolgáltatásban a funkcionalitást:

// auth-state.service.ts
import { Injectable } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/auth';
import { Observable } from 'rxjs';

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

  constructor(private auth: AngularFireAuth) {}

  monitorAuthState(): Observable<boolean> {
    return new Observable<boolean>(observer => {
      this.auth.authState.subscribe(user => {
        if (user) {
          console.log('State: You are logged in!');
          observer.next(true);
        } else {
          console.log('State: You are logged out!');
          observer.next(false);
        }
      });
    });
  }
}

Ez a szolgáltatás most egy observable-t ad vissza, amely igaz/hamis értékeket küld az előfizetőknek attól függően, hogy a felhasználó be van-e jelentkezve vagy sem, miközben az állapot változásait is kiírja a konzolra.

3. Használd a Szolgáltatást a Komponensekben:

Azon komponensekben, ahol szeretnéd használni ezt a funkcionalitást, injectáld be a AuthStateService szolgáltatást és hívd meg a monitorAuthState metódust:

import { Component, OnInit } from '@angular/core';
import { AuthStateService } from './path-to-auth-state.service'; // Frissítsd az útvonalat!

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

  constructor(private authStateService: AuthStateService) {}

  ngOnInit(): void {
    this.authStateService.monitorAuthState().subscribe();
  }
}

Ez a kód az adott komponensben előfizet a felhasználó hitelesítési állapotának változásaira és kiírja a konzolra a változásokat. Amikor már nem szeretnél előfizetni a változásokra (pl. komponens megsemmisítésekor), ne felejtsd el leiratkozni!