私はangelfire2を使用してデータベースの画像のdownloaUrlを保存します

Question

ストレージのアイテムのURLを取得できましたが、データベースに保存できません。 item.downloadUrlはthis.imageUrlを受信できません。アイテムのdownloadUrlをデータベースに保存する他の方法はありますか？

addItem(item){ 
     // @TODO - Storage ref 
    let storageRef = firebase.storage().ref(); 


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

     let path=`/${this.folder}/${selectedFile.name}`; 
     let iRef= storageRef.child(path); 
     iRef.put(selectedFile).then((snapshot)=>{ 
     item.image=selectedFile.name; 
     item.path=path; 

     storageRef.child(item.path).getDownloadURL().then((url)=>{ 
      //Setting Image Url below 
     this.imageUrl =url; 
     item.downloadUrl=this.imageUrl; 
     console.log(this.imageUrl); 
     }); 

     return this.items.push(item); 

     }).catch((error)=>{ 
     console.log(error); 
     }); 
    } 
    } 

Answer 1

ダウンロードURLがまだ取得されていない場合は、アイテムをデータベースにプッシュしています。

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

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

    let path=`/${this.folder}/${selectedFile.name}`; 
    let iRef= storageRef.child(path); 
    iRef.put(selectedFile).then((snapshot)=>{ 
     item.image=selectedFile.name; 
     item.path=path; 

     return storageRef.child(item.path).getDownloadURL().then((url)=>{ 
     //Setting Image Url below 
     this.imageUrl =url; 
     item.downloadUrl=this.imageUrl; 
     console.log(this.imageUrl); 
     return this.items.push(item); 
     }); 
    }).catch((error)=>{ 
    console.log(error); 
    }); 
} 

しかし、あなたはstorageRef.put()から完了コールバックで取得するスナップショットから直接ダウンロードURLを使用して、コードを大幅に簡素化することができます：これを修正するには、その後にdatabaseRef.push()への呼び出しを移動

for(let selectedFile of [(<HTMLInputElement>document.getElementById('image')).files[0]]){ 
    let path=`/${this.folder}/${selectedFile.name}`; 
    let iRef= storageRef.child(path); 
    iRef.put(selectedFile).then((snapshot)=>{ 
     item.image=selectedFile.name; 
     item.path=path; 
     var url = snapshot.downloadURL; 

     this.imageUrl =url; 
     item.downloadUrl=this.imageUrl; 
     return this.items.push(item); 
    }); 
}