Angular13报错No provider for AngularFirestoreCollection修复

AngularFirestoreCollection 不属于可注入的服务类，无法直接放到构造函数的依赖注入列表中让Angular DI容器创建实例。它是AngularFirestore对外暴露的集合引用类型，必须通过已经注入的AngularFirestore服务实例手动调用方法创建。
代码里直接在service构造函数里注入AngularFirestoreCollection<any>，是触发这个No provider报错的直接原因。

• 修改service层代码，移除构造函数中对AngularFirestoreCollection的直接注入，集合引用在类内部通过注入的AngularFirestore实例创建。
  修正后的service参考代码：

import { Injectable } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/compat/auth';
import { AngularFirestore, AngularFirestoreCollection } from '@angular/fire/compat/firestore';

@Injectable({
  providedIn: 'root'
})
export class YourService {
  // 类内部声明集合属性，不通过构造函数注入
  private itemsCollection: AngularFirestoreCollection<any>;

  constructor(
    public afAuth: AngularFireAuth,
    private afs: AngularFirestore
  ) { }

  getCollectionURL(filter: string) {
    const collectionPath = 'ecomm/shopp/products/category/' + filter;
    // 需要操作集合时，通过afs实例创建对应路径的集合引用
    this.itemsCollection = this.afs.collection(collectionPath);
    return collectionPath;
  }

  // 示例：读取集合数据的方法
  getFilteredProducts(filter: string) {
    const targetPath = this.getCollectionURL(filter);
    return this.afs.collection(targetPath).valueChanges();
  }
}

• 清理app.module.ts的冗余配置
  • 删除providers数组中手动添加的AngularFirestore项：AngularFirestoreModule导入后已经自动完成该服务的注册，手动声明provider反而可能引发注入异常
  • 移除重复的Firebase初始化逻辑：同时导入compat兼容版的AngularFire模块和新版模块化API的provide*系列初始化方法，会重复初始化Firebase应用，保留一套即可。如果暂时沿用compat写法，就注释掉provideFirebaseApp、provideFirestore等新版API的导入和注册；如果要迁移到新版模块化API，就移除所有@angular/fire/compat路径下的模块导入。
    调整后的核心app.module配置参考：

imports: [
  // 兼容版初始化（如果用compat写法就保留这部分）
  AngularFireModule.initializeApp(environment.firebase, 'ecomm'),
  AngularFirestoreModule,
  AngularFireAuthModule,
  AngularFireDatabaseModule,
  // 以下为新版模块化API初始化，和上面compat初始化二选一，不要同时启用
  // provideFirebaseApp(() => initializeApp(environment.firebase)),
  // provideAuth(() => getAuth()),
  // provideDatabase(() => getDatabase()),
  // provideFirestore(() => getFirestore()),
  // provideStorage(() => getStorage())
],
providers: [
  {
    provide: MatDialogRef,
    useValue: {}
  },
  EventEmitterService
]

AngularFire 7版本同时支持兼容版（compat路径下的类式API，和旧版AngularFire写法一致）和新版模块化函数式API，两种写法不要在同一个项目里混用，否则容易出现各类注入、实例初始化异常。

内容的提问来源于stack exchange，提问作者yumi zaids