如何在关于firestore的角度测试中解决此错误(没有InjectionToken angularfire2.app.

Question

在我的角度测试中，我在一些组件和使用firestore的服务中遇到了这个问题。例如，这是我的itemservice中的一个错误：NullInjectorError:R3InjectorError(DynamicTestModule([ItemService->AngularFirestore->InjectionToken angularfire2.app.options->NullInjectorError:InjectionToken angularfire2.app.options没有提供程序！

import { Injectable } from '@angular/core';
import {
AngularFirestore,
AngularFirestoreCollection,
} from '@angular/fire/firestore';
import { Item } from '../../environments/item';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root',
})
export class ItemService {
itemsCollection: AngularFirestoreCollection<Item> | undefined;
items: Observable<Item[]>;
idField: any;
itemDoc: any;
constructor(public afs: AngularFirestore) {
this.items = this.afs
.collection<Item>('items')
.valueChanges({ idField: 'id' });
this.itemsCollection = this.afs.collection<Item>('items');
}
}

这是我的应用程序模块.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { environment } from '../environments/environment';
import { AngularFireModule } from '@angular/fire';
import {
AngularFirestore,
AngularFirestoreModule,
} from '@angular/fire/firestore';
import { ItemsComponent } from './components/items/items.component';
import { ItemService } from './services/item.service';
import { ItemComponent } from './components/item/item.component';
import { RouterModule } from '@angular/router';
import { NavComponent } from './components/nav/nav.component';
import { CartComponent } from './components/cart/cart.component';
import { CartService } from './services/cart.service';
import { AddItemComponent } from './components/add-item/add-item.component';
import { AngularFireDatabaseModule } from '@angular/fire/database';
@NgModule({
declarations: [
AppComponent,
ItemsComponent,
ItemComponent,
NavComponent,
CartComponent,
AddItemComponent,
],
imports: [
BrowserModule,
AppRoutingModule,
AngularFirestoreModule,
AngularFireDatabaseModule,
AngularFireModule.initializeApp(environment.firebase, 'project2'),
RouterModule.forRoot([
{ path: '', component: ItemsComponent },
{ path: 'details/:id', component: ItemComponent },
{ path: 'cart', component: CartComponent },
{ path: 'newitem', component: AddItemComponent },
]),
FormsModule,
ReactiveFormsModule,
],
providers: [CartService, ItemService],
bootstrap: [AppComponent],
})
export class AppModule {}

Answer 1

我有同样的消息错误，这对我来说很有效：

进口(在所有使用firebase的测试地毯中(：

import { AngularFireModule } from '@angular/fire/compat';
import { AngularFirestoreModule } from '@angular/fire/compat/firestore';
import { environment } from 'src/environments/environment';

和：

beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [
AngularFireModule.initializeApp(environment.firebaseConfig),
AngularFirestoreModule
],
declarations: [ LoginComponent ],
schemas: [ CUSTOM_ELEMENTS_SCHEMA ],
})
.compileComponents();
});

这对我来说很有效

Answer 2

您可以尝试替换：

AngularFireModule.initializeApp(environment.firebase, 'project2'),AngularFireModule.initializeApp(environment.firebase),

方法initializeApp()在从angularfire2更改为angularFire后仅接收firebase配置

正如AngularFire Quickstart中所提到的，它只传递了firebase配置，因为它包含应用程序名称。