I have two angular 16.2 projects dashborad project and blog front end project
I am using firestore to store data and firebase authentication.
I added package @angular/fire using npm → 7.6.1 version
And uses its functions to store data and retrieve data and authenticate.
In dashboard everything works great.
Now I am connecting my dashboard to front end to make data dynmic in front end
I want to get all categories from the backend
I added same package as backend
in my app.module I have :
import { provideFirebaseApp , initializeApp } from ‘@angular/fire/app’;
import { getFirestore, provideFirestore } from ‘@angular/fire/firestore’;
import { environment } from ‘src/environments/environment.prod’;
imports: [
provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
provideFirestore(() => getFirestore())
],
in service :
to get categories :
import { Injectable } from ‘@angular/core’;
import { Observable } from ‘rxjs’;
import { Firestore ,
collection ,
collectionData } from ‘@angular/fire/firestore’;
@Injectable({
providedIn: ‘root’
})
export class CategoriesService {
categoriesData !: Observable;
constructor(private firestore : Firestore) { }
loadData(){
const collectionInstance = collection(this.firestore,‘categories’);
return this.categoriesData = collectionData(collectionInstance, { idField: ‘id’});
}
}
Now I am getting this error
ERROR FirebaseError: Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore
even though I used the same code in dashboard with no errors