使用angularfire2获取firebase中图像的url

我正在使用angularFire2将图像添加到firebase存储中，我现在需要的是从图像中获取这些URL，并将它们显示在图库中，以便它们可以在加载后立即显示。我尝试了一些方法，但没有成功，我希望您能帮助我，我的代码如下：

组件1.ts：

    import { Component, OnInit } from '@angular/core';
import { AngularFireStorage, AngularFireUploadTask } from 'angularfire2/storage';
import { Observable } from 'rxjs';
import { AngularFirestore } from 'angularfire2/firestore';
import { filter, switchMap } from '../../../../node_modules/rxjs/operators';
import { tap } from 'rxjs/operators';





@Component({
  selector: 'app-file-upload',
  templateUrl: './file-upload.component.html',
  styleUrls: ['./file-upload.component.scss']
})
export class FileUploadComponent implements OnInit {

  urlImages: string

  // Main task 
  task: AngularFireUploadTask;

  // Progress monitoring
  percentage: Observable<number>;

  snapshot: Observable<any>;

  // Download URL
  downloadURL: Observable<string>;

  // State for dropzone CSS toggling
  isHovering: boolean;
  //variable para obtener url
  image: string

  constructor(private storage: AngularFireStorage, private db: AngularFirestore) { }


  ngOnInit() {
  }



  toggleHover(event: boolean) {
    this.isHovering = event;
  }


  startUpload(event: FileList) {
    // The File object
    const file = event.item(0)

    // Client-side validation example
    if (file.type.split('/')[0] !== 'image') {
      console.error('unsupported file type :( ')
      return;
    }

    // El path del archivo en storage
    const path = `blog/${new Date().getTime()}_${file.name}`;

    // Metadata Personalizada
    const customMetadata = { app: 'CMS DsnAdmin' };

    // Declaramos la tarea
    this.task = this.storage.upload(path, file, { customMetadata })

    // Porcentaje de Carga
    this.percentage = this.task.percentageChanges();
    console.log('Image cargada!');
    this.snapshot = this.task.snapshotChanges()

    // Url del archivo
    const task = this.storage.upload(path, file);
    const ref = this.storage.ref(path);

  }

  // Determines if the upload task is active
  isActive(snapshot) {
    return snapshot.state === 'running' && snapshot.bytesTransferred < snapshot.totalBytes
  }

}

从'@angular/core'导入{Component，OnInit}；
从“angularfire2/storage”导入{AngularFireStorage，AngularFireUploadTask}；
从“rxjs”导入{Observable}；
从“angularfire2/firestore”导入{AngularFirestore}；
从“../../../../node_modules/rxjs/operators”导入{filter，switchMap}；
从“rxjs/operators”导入{tap}；
@组成部分({
选择器：“应用程序文件上载”，
templateUrl:“./file upload.component.html”，
样式URL:['./文件上载.component.scss']
})
导出类FileUploadComponent实现OnInit{
URL图像：字符串
//主要任务
任务：AngularFireUploadTask；
//进度监测
百分比：可见；
快照：可观察；
//下载网址
下载URL：可观察；
//dropzone CSS切换的状态
Ishoring：布尔型；
//可变参数访问器url
图像：字符串
构造函数（专用存储：AngularFireStorage，专用数据库：AngularFirestore）{}
恩戈尼尼特（）{
}
切换悬停（事件：布尔值）{
this.isHovering=事件；
}
startUpload（事件：文件列表）{
//文件对象
const file=event.item（0）
//客户端验证示例
if（file.type.split（'/'）[0]！=='image'）{
console.error（'不支持的文件类型：（'））
返回；
}
//El path del archivo en仓库
const path=`blog/${new Date（）.getTime（）}{file.name}`；
//元数据个性化
const customMetadata={app:'CMS DsnAdmin'}；
//塔雷阿莫斯酒店
this.task=this.storage.upload（路径、文件，{customMetadata}）
//卡尔加瓷器
this.percentage=this.task.percentageChanges（）；
log（'Image cargada！'）；
this.snapshot=this.task.snapshotChanges（）
//阿奇沃酒店
const task=this.storage.upload（路径、文件）；
const ref=this.storage.ref（路径）；
}
//确定上载任务是否处于活动状态
isActive（快照）{
返回snapshot.state=='running'&&snapshot.bytesttransfered

---

我希望您能帮助我我是这个网络的新手，以防您以不正确的方式提问。

您可以将已定义的属性设置为保存下载URL

downloadURL: Observable<string>;

---

请在以下网址查看更多信息：

Muchas gracias amigo me Functionó。

// get notified when the download URL is available
task.snapshotChanges().pipe(
    finalize(() => this.downloadURL = ref.getDownloadURL() )
 )
.subscribe()