Firebaseからイメージパスを取得し、Firebaseストレージからイメージを取得して表示するにはどうすればよいですか？

Question

私はしようとしています。

1. firebaseストレージ
2. からfirebaseデータベース
3. のget画像からゲットイメージパスが

この画像を表示私はAngular2/Angularfire2を使用

ここに私の現在のコードです。

this.products = af.database.list('products/') 
    this.products.subscribe((data: any) => { 
     data.forEach(item => { 
      firebase.storage().ref().child('products/' + item.img) 
      .getDownloadURL() 
      .then(url => { 
       item.image = url; 
      }); 
     }) 
     } 
    ) 

ここは私のテンプレートです。

<ion-card *ngFor="let item of products |async" text-center 
     [ngStyle]="item.image ? {'background': 'url(' + (item?.image) + ')'} : {}"> 

私はパスを取得してダウンロードURLを取得できます。

しかし、私はそれを表示することはできません。

助けがあれば助かります。

Answer 1

余分な配列を追加して表示して、一時的な解決策を達成しました。どんな解決策もまだ歓迎します。

this.productss = [] 

this.products = af.database.list('/products') 
this.products.subscribe((data: any) => { 
    data.forEach(item => { 
     firebase.storage().ref().child('products/' + item.img) 
     .getDownloadURL() 
     .then(url => { 
      item.image = url; 
      this.productss.push(item) 
     }); 
    }) 
    } 
)