因此,我能够成功地将图像上传到FireStore存储。
现在我正在尝试将存储在FireStore中的图像应用到应用程序上人们的用户配置文件中。
import {ActivatedRoute} from '@angular/router';
import { AngularFireStorage } from 'angularfire2/storage';
export class ProfileComponent implements OnInit {
routeParams;
profilePicture: any = "../../assets/default-img.png"
constructor(
private afStorage: AngularFireStorage,
private route: ActivatedRoute,
) { }
ngOnInit()
{
this.routeParams = this.route.params.subscribe(
params => {
/*Update Variables here*/
if (email.__email != "")
{
let path = "/" + email.__email + "/profile.png";
this.profilePicture = this.afStorage.ref(path).getDownloadURL();
}
});
}
}
我想做的就是从FireStore存储中检索img并将其应用于个人资料图片。
看看这里的留档。
'getDownloadURL()'返回一个Promise,因此您必须解析该Promise才能实际从URL获取数据。如果您的超文本标记语言模板使用的是profile ilePicture
,您可以在ngOnInit()
中将URL设置为图像源:
this.afStorage.ref(path).getDownloadURL().then(function(url) {
var img = document.getElementById('myimg');
img.src = url;
}).catch(function(error) {
// Handle any errors
});