AngularFire – 解决 NullInjectorError 的方法
在操作AngularFire时,我遇到了一点困难,所以我把它记录下来作为备忘。
事件
使用 AngularFire 中的 AngularFireDatabase 模块尝试连接到实时数据库时,出现了以下错误。
由于没有提供 InjectionToken,所以需要将 AngularFireDatabase 设置为提供者,但是这样做似乎不太顺利。。
ERROR NullInjectorError: R3InjectorError(AppModule)[AngularFireDatabase -> InjectionToken angularfire2.app.options -> InjectionToken angularfire2.app.options -> InjectionToken angularfire2.app.options]:
NullInjectorError: No provider for InjectionToken angularfire2.app.options!
环境
使用ng版本的输出结果。
似乎与@angular/fire的7系相关。
@angular-devkit/architect 0.1302.6
@angular-devkit/build-angular 13.2.6
@angular-devkit/core 13.2.6
@angular-devkit/schematics 13.2.6
@angular/cli 13.2.6
@angular/fire 7.3.0
@schematics/angular 13.2.6
rxjs 7.5.5
处理方法
提供者未设置导致错误,但需要对其格式进行一些改进才行。
import { NgModule } from "@angular/core";
import { FormsModule } from "@angular/forms";
import { BrowserModule } from "@angular/platform-browser";
import { AppComponent } from "./app.component";
import { CommentDatePipe } from "./pipes/comment-date.pipe";
import { initializeApp, provideFirebaseApp } from "@angular/fire/app";
import { environment } from "../environments/environment";
import { provideAuth, getAuth } from "@angular/fire/auth";
import { provideDatabase, getDatabase } from "@angular/fire/database";
import { FIREBASE_OPTIONS } from "@angular/fire/compat";
@NgModule({
declarations: [AppComponent, CommentDatePipe],
imports: [
BrowserModule,
FormsModule,
provideFirebaseApp(() => initializeApp(environment.firebase)),
provideAuth(() => getAuth()),
provideDatabase(() => getDatabase()),
],
providers: [{ provide: FIREBASE_OPTIONS, useValue: environment.firebase }],
bootstrap: [AppComponent],
})
export class AppModule {}