NullInjectorError: No provider for Firestore with Angular

Using Angular and Angular cli: 16.2.12 Firebase: 13.5.2, I get this error:

NullInjectorError: R3InjectorError(Standalone[AddEditComponent])[DataService -> DataService -> DataService -> DataService -> Firestore -> Firestore]: NullInjectorError: No provider for Firestore!

using the imports for Firestore as defined in the following code:

add-edit.component.ts file:

 import { Component } from '@angular/core'; import { DataService } from '../services/data.service'; .......... import { FirestoreModule } from '@angular/fire/firestore'; import { FirebaseAppModule } from '@angular/fire/app';@Component({ templateUrl: 'add-edit.component.html', standalone: true, imports: [....... FirestoreModule, FirebaseAppModule,],}) export class AddEditComponent implements OnInit {   constructor( ......  public dataService: DataService ) {}addUser(  firstName: string | undefined,  lastName: string | undefined,  email: string | undefined,  ) { this.dataService.createUser(  firstName,  lastName,  email, );}

app.module.ts file:

import { NgModule } from '@angular/core';import { BrowserModule } from '@angular/platform-browser';import { FormsModule } from '@angular/forms'; ....... .......import { environment } from '@environments/environment';import { initializeApp, provideFirebaseApp } from '@angular/fire/app';import { provideFirestore, getFirestore, FirestoreModule} from '@angular/fire/firestore';@NgModule({ imports: [......BrowserModule, FormsModule,FirestoreModule,provideFirestore(() => getFirestore()),provideFirebaseApp(() => initializeApp(environment.firebase)), ],providers: [ { provide: NgChartsConfiguration, useValue: { generateColors: false } },],})export class AppModule {}

data.service.ts file:

import { Injectable } from '@angular/core';import {Firestore, addDoc, collection, getDocs, query} from '@angular/fire/firestore'; @Injectable({ providedIn: 'root',})export class DataService {  constructor(public firestore: Firestore) {}  async createUser(firstName?: string, lastName?: string, email?: string,  ) {   const docRef = await addDoc(collection(this.firestore, 'users'), {  email: email,  firstName: firstName,  lastName: lastName,});console.log('Document written with ID: ', docRef.id); }}

environment.ts file:

export const environment = { apiUrl: 'http://localhost:4200', firebase: {apiKey: '...',authDomain: '....firebaseapp.com',databaseURL:'https://.....firebasedatabase.app',projectId: '...',storageBucket: '.....appspot.com',messagingSenderId: '.....',appId: '...',measurementId: '....', },};