Igino Boffa
Igino Boffa

Reputation: 736

Angular 12: Firebase modulesnot correctly provided (?)

First time using Firebase so I don't know what's going on. I did not modify the configuration got using ng add @angular/fire, so what I have in my AppModule is:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    provideFirebaseApp(() => initializeApp(environment.firebase)),
    provideFirestore(() => getFirestore()),
    provideAuth(() => getAuth()),
    provideDatabase(() => getDatabase()),
    provideFunctions(() => getFunctions()),
    provideMessaging(() => getMessaging()),
    provideRemoteConfig(() => getRemoteConfig()),
    provideStorage(() => getStorage()),
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

In a different module, using lazy loading, I call method signInWithEmailAndPassword(auth, email, password), but I get the following error in console:

Either AngularFireModule has not been provided in your AppModule (this can be done manually or implictly using
provideFirebaseApp) or you're calling an AngularFire method outside of an NgModule (which is not supported).

What am I missing?

Upvotes: 5

Views: 6960

Answers (1)

Niels Van Haren
Niels Van Haren

Reputation: 440

Ok i found the solution for this problem.

It appears that you need to inject the auth instance of angularfire in your service.

import {Auth, sendPasswordResetEmail, signOut} from '@angular/fire/auth';

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

    constructor(..., private auth: Auth,) {
    }
    
     getFirebaseUser(): any {
        return this.auth.currentUser;
    }

    logout() {
        signOut(this.auth);
    }
    
    resetPassword(email: string) {
        return sendPasswordResetEmail(this.auth, email);
    }

    if (this.credentialsForm.valid) {
            signInWithEmailAndPassword(this.auth,this.credentialsForm.controls.email.value,
                this.credentialsForm.controls.password.value).then(result => { ... }
                }
}

after using this instance, it worked like a charm.

Upvotes: 14

Related Questions