Property 'downloadURL' does not exist on type 'AngularFireUploadTask'
const task = this.storage.upload(path, file);
const ref = this.storage.ref(path);
this.uploadPercent = task.percentageChanges();
console.log('Image uploaded!');
task.snapshotChanges().pipe(
finalize(() => {
this.downloadURL = ref.getDownloadURL()
this.downloadURL.subscribe(url => (this.image = url));
})
)
.subscribe();
The actual change in code you will need from this video.
UPDATE - 8/30/20
For those of you that want cleaner code, use promises (await in an async function):
const task = this.storage.upload(path, file);
const ref = this.storage.ref(path);
this.uploadPercent = task.percentageChanges();
// upload image, save url
await task;
console.log('Image uploaded!');
this.image = await ref.getDownloadURL().toPromise();
i got this error while using angular + firebase to upload image,The method DownloadURL()
doesn't rely on the task anymore, so i will post below how i solved that error
upload(event) {
const id = Math.random().toString(36).substring(2);
this.ref = this.afStorage.ref(id);
this.task = this.ref.put(event.target.files[0]);
this.task.snapshotChanges().pipe(
finalize(() => this.downloadURL = this.ref.getDownloadURL() ))
.subscribe();
if you want the image source url to anything,you can get it like this,
this.task.snapshotChanges().pipe(
finalize(() => {
this.ref.getDownloadURL().subscribe(url => {
console.log(url); // <-- do what ever you want with the url..
});
}))
.subscribe();
The method you want to call is
getDownloadURL();
Please have a look at this page.
https://github.com/angular/angularfire2/blob/master/docs/storage/storage.md
Here you can see the the method's signature is
getDownloadURL(): Observable<any>