Good morning everyone, I just started learning Angular programming 3-4 months ago. And right now I’m practicing CRUD using Firestore database. I have this error while I’m trying to delete on my program: ‘core.mjs:10592 ERROR FirebaseError: Invalid collection reference. Collection references must have an odd number of segments, but Notes/r5GucE9DETw36sJKCMgi has 2.’ I tried several ways, but still the same error.
Here’s my HTML:
<div class="col-md-4" *ngFor="let note of notesData">
<div class="card card-body">
<h5 class="card-title">{{ note.title }}</h5>
<p class="text-muted">{{ note.description }}</p>
<div class="d-flex align-items-center">
<span class="mx-2">
<i class="bi bi-pencil-square" data-bs-toggle="modal"
data-bs-target="#editNotesModal"></i>
</span>
<span class="mx-2">
<i class="bi bi-trash" (click)="deleteNote(note)"></i>
</span>
</div>
My TS file:
noteForm!: FormGroup;
notesData: any;
noteObj: Note = {
id: '',
title: '',
description: ''
}
constructor(private fb: FormBuilder, private noteService: NoteService){
this.noteForm = this.fb.group({
title: ['', Validators.required],
description: ['', Validators.required]
})
}
ngOnInit(){
this.fetchAllNotes()
}
addNote(){
const { value } = this.noteForm
console.log(value);
this.noteObj.id = '',
this.noteObj.title = value.title,
this.noteObj.description = value.description
this.noteService.addNote(this.noteObj).then((note)=>{
if(note){
alert("Note Added Successfully")
}
})
this.noteForm.reset()
}
fetchAllNotes(){
this.noteService.getNotes().subscribe((res: Note[])=>{
console.log(res)
this.notesData = res;
})
}
deleteNote(note: Note){
let delConfirm = confirm('Delete current selected Note?');
if (delConfirm == true){
this.noteService.deleteNote(note);
}
}
}
**My service: **
addNote (note: Note){
note.id = doc(collection(this.fs, 'id')).id
return addDoc(collection(this.fs, 'Notes'), note)
}
getNotes():Observable<Note[]>{
let notesRef = collection(this.fs, 'Notes')
return collectionData(notesRef, {idField: 'id'}) as Observable<Note[]>
}
deleteNote(note: Note){
let docRef = doc(collection(this.fs,`Notes/${note.id}`));
return deleteDoc(docRef)
}
updateNote(note: Note, notes: any){
let docRef = doc(this.fs, `Notes/${note.id}`);
return updateDoc(docRef, notes)
}
and my firebase databaseFirestore database
I tried this https://firebase.google.com/docs/firestore/manage-data/delete-data#collections but more error occurs, would love to know what did I do wrong.
>Solution :
In the following code
deleteNote(note: Note){
let docRef = doc(collection(this.fs,`Notes/${note.id}`));
return deleteDoc(docRef)
}
the way you define the docRef
is not correct: collection(this.fs,`Notes/${note.id}`)
generates the error because with Notes/${note.id}
you pass 2 segments to the collection method when it expects an odd number. The Notes/r5GucE9DETw36sJKCMgi
path is a Document path, not a Collection path.
In addition, you try to pass only a CollectionReference
to the doc()
method.
The following should do the trick:
deleteNote(note: Note){
let docRef = doc(this.fs,'Notes', note.id);
return deleteDoc(docRef)
}