I am currently working with Angularfire2 for handling image uploads and downloads. Unfortunately, I have encountered an issue after the removal of getDownloadURL().
import { finalize } from 'rxjs/operators';
@Component({
selector: 'app-root',
template: `
<input type="file" (change)="uploadFile($event)" />
<div>{{ uploadPercent | async }}</div>
<a [href]="downloadURL | async">{{ downloadURL | async }}</a>
`
})
export class AppComponent {
uploadPercent: Observable<number>;
downloadURL: Observable<string>;
constructor(private storage: AngularFireStorage) {}
uploadFile(event) {
const file = event.target.files[0];
const filePath = 'name-your-file-path-here';
const fileRef = this.storage.ref(filePath);
const task = this.storage.upload(filePath, file);
// observe percentage changes
this.uploadPercent = task.percentageChanges();
// receive notification once download URL is available
task.snapshotChanges().pipe(
finalize(() => this.downloadURL = fileRef.getDownloadURL() )
)
.subscribe()
}
}
Although I am able to access the downloadURL in the HTML page, I am unsure of how to access it within the function itself.