NullInjectError in HomeComponent

Discussão em 'Angular' iniciado por Riccardo, Novembro 9, 2024.

  1. Riccardo

    Riccardo Guest

    I'm getting this error when starting the HomeComponent. The configuration is specified inside the environment file and is correct. Could I be injecting something incorrectly? Do I need to inject anything else?. These are the files used. Please I need help, thank you very much

    Error:
    ERROR Error [NullInjectorError]: R3InjectorError(Standalone[_HomeComponent])[_AuthenticationService -> _AuthenticationService -> _AngularFireAuth -> InjectionToken angularfire2.app.options -> InjectionToken angularfire2.app.options]


    app.config.ts

    export const appConfig: ApplicationConfig = {
    providers: [
    provideZoneChangeDetection({ eventCoalescing: true }),
    provideRouter(routes),
    provideClientHydration(),
    provideHttpClient(withFetch()),

    provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
    provideAuth(() => getAuth()),
    provideFirestore(() => getFirestore()),
    ]
    };


    home.component.ts

    import { Component } from '@angular/core';
    import { RouterLink } from '@angular/router';
    import { TranslateModule } from '@ngx-translate/core';
    import { AuthenticationService } from '../auth/authentication.service';

    @Component({
    selector: 'app-home',
    standalone: true,
    imports: [TranslateModule, RouterLink],
    templateUrl: './home.component.html',
    })
    export class HomeComponent {

    constructor(private auth: AuthenticationService) { }

    signOut() {
    this.auth.signOut().subscribe({
    next: () => {
    },
    error: error => {
    }
    });
    }
    }


    authentication.service.ts

    import { Injectable } from '@angular/core';
    import { AngularFireAuth } from '@angular/fire/compat/auth';
    import { FirebaseError } from 'firebase/app';
    import { catchError, from, Observable, throwError } from 'rxjs';

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

    constructor(private auth: AngularFireAuth) { }

    signIn(email: string, password: string): Observable<any>{
    return from(this.auth.signInWithEmailAndPassword(email, password))
    .pipe(
    catchError((error: FirebaseError) =>
    throwError(() => console.log('Errore'))
    )
    );
    }

    signUp(email: string, password: string): Observable<any>{
    return from(this.auth.createUserWithEmailAndPassword(email, password)).pipe(
    catchError((error: FirebaseError) =>
    throwError(() => console.log('Errore'))
    )
    );
    }

    //exc...
    }

    Continue reading...

Compartilhe esta Página