Attempting to create a docReference using Angular firebase

Question

What I am attempting to do is create a document Reference in my Firebase database that will return me an id and a doc Reference, so I can use that id to create a path for this object's image in my storage.

So according to the firebase docs I should be able to do this:

var newPlantRef = db.collection(`users/${this.userId}/plants`).doc();

But that is returning this error:

AddPlantComponent.html:30 ERROR FirebaseError: Function CollectionReference.doc() requires its first argument to be of type non-empty string, but it was: undefined

So I found a work-around on Github that says I should do this:

const id = this.afs.createId();
const ref = this.afs.collection(`users/${this.userId}/plants`).doc(id);

But when I do this:

this.newPlantId = this.db.createId();
this.newPlantRef = this.db.collection(`users/${this.userId}/plants`).doc(this.newPlantId).ref;
this.newPlantRef.update({
      name: 'Test1',
      primaryImgURL: 'test1',
      addedDate: new Date()
    });
  }

I get this error:

ERROR Error: Uncaught (in promise): FirebaseError: [code=not-found]: No document to update: projects/plant-app-d9298/databases/(default)/documents/users/UoV0MXMfZGhMgmMJHpiMU41aLZG2/plants/LWmM79JotgDn20hPOcA1
FirebaseError: No document to update: projects/plant-app-d9298/databases/(default)/documents/users/UoV0MXMfZGhMgmMJHpiMU41aLZG2/plants/LWmM79JotgDn20hPOcA1

Am I doing something wrong? Is there some other workaround where I can get the document id before I've done an add so my items and storage can reference that id?

That's because you have to call the set method instead of the update method since that particular document doesn't exist in the first place. — Edric
– Edric, Commented Nov 5, 2019 at 1:57

Madara Uchiha · Accepted Answer · 2019-11-05 03:34:55Z

You can push the document to the collection first and then it will return the id of the document. Use that id in your file path to upload it to firestorage and then you can update the document with the url and path ref.

something like this

uploadFile(id) {
const file = event.target.files[0];

let filePath = '';
filePath = 'path' + id;

const ref = this.afs.ref(filePath);
const task = ref.put(file);

// observe percentage changes
this.uploadPercent = task.percentageChanges();
// get notified when the download URL is available
return task.snapshotChanges().pipe(
  finalize(() => {
    this.downloadURL = ref.getDownloadURL()
  })
).toPromise();
}


saveData() {
  const collectionRef = this.afs.collection('your path');
  collectionRef.add(data).then((res) => {
  const docId = res.id;
  // then upload the file
  this.uploadFile(docId)
  .then(() => {
              // then update the document
              this.downloadURL.subscribe(imgUrl => {
              const imageUrl = imgUrl;
                // Then update the document with imageUrl using the docId

              });
            });

});

hope it helps

Collectives™ on Stack Overflow

Attempting to create a docReference using Angular firebase

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related