【问题标题】：Firebase Storage in Ionic 2 does not load the image immediately #askfirebaseIonic 2 中的 Firebase 存储不会立即加载图像#askfirebase
【发布时间】：2017-05-22 20:46:42
【问题描述】：

我正在尝试在 Ionic2 中使用 Firebase Storage 存储的图像，但它无法正常工作。问题在于使用离子标签时。我将它放在一个单独的组件（HeaderComponent）中。它会在打开的主选项卡上加载，但不会在其他选项卡上加载。

interface IUser {
  id: string;
  avatar: string;
}

const avatarRef = firebase.storage().ref(this.user.id + "/avatar.jpeg");

avatarRef.getDownloadURL().catch(err => {
  console.log('oh no');
}).then((avatarUrl) => {
  this.user.avatar = avatarUrl;
});

<img [src]="user.avatar">

[已解决]

我所做的是将标题组件放在 tabs.html 中。所以标题只在应用程序中加载一次。缺点是 ngIf 开发多了可能会很多，而且每个 tab 需要不同的功能。

【问题讨论】：

那你在console.log(this.user.avatar)里面做过吗？
是的，我得到了适当的 firebase url

标签： angular ionic2 firebase-storage

【解决方案1】：

您还没有提到如何调用该方法。但你可以使用NgZone

constructor(public zone: NgZone){}

然后在方法中

avatarRef.getDownloadURL().catch(err => {
  console.log('oh no');
}).then((avatarUrl) => {
  this.zone.run(()=>{
    this.user.avatar = avatarUrl;
  })
});

您可以查看this。

【讨论】：

它在构造函数中，所以它会立即被调用。