Jak pobrać downoladURL z plików przesłanych za pomocą AngularFireStorage wymienionego w kolekcji - angular5, google-cloud-firestore, firebase-storage, angularfire2

I "m używając Angular v" 5.2.0 "i angularfire2 v" 5.0.0-rc.6 "

„Przesyłam obrazy do miejsca przechowywania za pomocą angularfire2 i odnosę je do kolekcji o nazwie zdjęcia: Kolekcja ma tę strukturę:

• teamName: „teamName”
• ścieżka: „storageLocation / fileName.jpg”

• rozmiar: „4544”

  <div *ngFor="let team  of teams |async">
  <h3>{{ team.teamName }}</h3>
  <img class="card-img-top" [src]="team.path" width=50px>
  <button class="button is-danger" (click)="close()">Close</button>
  </div>
  

Przykład podany w dokumentacji mówi, że muszę wskazać konkretną lokalizację locationPath, aby wywołać funkcje do pobrania do downloadURl

constructor(private storage: AngularFireStorage) {
const ref = this.storage.ref("users/davideast.jpg");
this.profileUrl = ref.getDownloadUrl();
}

Czy istnieje sposób na pobranie downloadURL z listy dokumentów?

Odpowiedzi:

Sposób, w jaki to zrobiłem, to utworzenie rury i przejście przez img z * ngIf:

    <div *ngFor="let photo of photos | async">
<img class="galleryImage" *ngIf="photo.path | downloadUrl | async as photoUrl" [src]="photoUrl">
</div>

Rura „downloadUrl” używa funkcji .getDownloadURL () z angularfire2:

    @Pipe({name: "downloadUrl"})

export class DownloadUrlPipe implements PipeTransform {

constructor(public storage: AngularFireStorage){}

transform(featuredPhoto: any): any {
let photo = this.storage.ref(featuredPhoto).getDownloadURL().do(console.log);
return photo;
}
}