上传到Firebase存储后刷新图像

时间:2018-08-03 17:06:01

标签: javascript angular firebase-realtime-database ionic3 firebase-storage

我正在使用Angular 5和Firebase开发Ionic 3应用程序。使用此示例https://github.com/firebase/functions-samples/tree/master/generate-thumbnail在上载图像后,将调整图像的大小并保存缩略图。但是,在将缩略图网址保存到数据库后,我似乎无法在应用程序中刷新图像。

这是生成事件嘉宾列表的代码。重新启动应用程序后,缩略图会更改。

guestsRef: AngularFireList<any>;
guests: Observable<any[]>;

this.guestsRef = this.db.list(`attending/${id}`);
this.guests = this.guestsRef.snapshotChanges().pipe(
  map(changes =>
    changes.map(c => ({ key: c.payload.key, ...c.payload.val() }))
  )
);

HTML

<ion-item *ngFor="let guest of guests | async" class="guest-list">
            <ion-thumbnail item-start>
              <img [src]="guest.photoURL">
            </ion-thumbnail>
            <p>{{(guest)?.first_name}} {{(guest)?.last_name}}</p>
          </ion-item>
        </ion-list>

我将thumbFileUrl保存到数据库中。上面网址中的功能示例的小片段

}).then((results) => {
    console.log('Got Signed URLs.');
    const thumbResult = results[0];
    const originalResult = results[1];
    const thumbFileUrl = thumbResult[0];
    const fileUrl = originalResult[0];
    // Add the URLs to the Database
    return admin.database().ref('images').push({path: fileUrl, thumbnail: thumbFileUrl});
  }).then(() => console.log('Thumbnail URLs saved to database.'));

0 个答案:

没有答案