angular - 我的个人资料图片仅在我在应用加载时触摸它后才会出现

Question

我使用 Ionic 4、Firebase、Angular 创建了一个社交媒体应用程序，它在 Android 上运行良好。但在 iOS 上，当我加载应用程序时，我的个人资料图片不会出现，除非我实际触摸它。

这是代码

  async ngOnInit() {
    firebase.auth().onAuthStateChanged(user => {
      console.log('onAuthStateChanged', user.uid);

      this.currentUser = user;
      this.imageService.getImageDownloadUrl( 'profilePicture', user.uid)
      .then((photo) => {
        console.log('getImageDownloadUrl', photo);

        this.profilePicture = (photo === 'undefined') ? 'false' : photo;
        console.log('profilePicture', this.profilePicture);
      });
    });
  }

  <div class="profilePhoto" [ngSwitch]="profilePicture">
    <div *ngSwitchDefault>
    <img [src]="profilePicture" (click)="Present('profilePicture')">
  </div>
  <div class="logo" *ngSwitchCase="'false'">
    <ion-img style="padding-top: 25px; " src="assets/image/SpaghettiPlus2.png" (click)="openImagePicker('profilePicture')"></ion-img>
  </div>
</div>

我不必在 Android 上触摸图片，它只是在加载时出现，但在 iOS 上，它不会加载实际图片，它只会保留默认图片，直到我实际触摸图片然后它神奇地出现。

Answer 1

试试 NgZone，因为我使用下面的代码，你会得到你想要的吗

 constructor(ngZone: NgZone){ }

async ngOnInit() {
  firebase.auth().onAuthStateChanged(user => {
    this.currentUser = user;
    this.imageService.getImageDownloadUrl('profilePicture', user.uid)
      .then((photo) => {
        console.log('getImageDownloadUrl', photo);

        this.ngZone.run(() => {
          this.profilePicture = (photo === 'undefined') ? 'false' : photo;
          console.log('profilePicture', this.profilePicture);
        }
          });
  });
}