I am trying to upload a single image to Firebase Storage, then grab its download url and assign this to a variable.

I can upload my image to firebase successfully, however I cannot retrieve the download url. here is what I have tried already.

upload() {

    let storageRef = firebase.storage().ref();

    let success = false;



    for (let selectedFile of [(<HTMLInputElement>document.getElementById('file')).files[0]]) {

      let router = this.router;

      let af = this.af;

      let folder = this.folder;

      let path = `/${this.folder}/${selectedFile.name}`;

      var iRef = storageRef.child(path);

      iRef.put(selectedFile).then((snapshot) => {

        console.log('Uploaded a blob or file! Now storing the reference at', `/${this.folder}/images/`);

        af.list(`/${folder}/images/`).push({ path: path, filename: selectedFile.name })

      });

    }



    // This part does not work

    iRef.getDownloadURL().then((url) => {this.image = url});

    console.log('IREF IS ' + iRef)

    console.log('IMAGEURL IS ' + this.image)



  }

The Console logs are these:

    IREF IS gs://my-app-159520.appspot.com/images/Screen Shot 2017-08-14 at 12.19.01.png

    view-order.component.ts:134 IMAGEURL IS undefined

Uploaded a blob or file! Now storing the reference at /images/images/

I have been trying to use the iRef reference to grab the download url but I keep getting errors. I am trying to grab the url so I can assign it to the this.image variable and then store it in my database using another function.