Angularfire2错误“属性'downloadURL在类型'AngularFireUploadTask'上不存在。”

时间:2018-05-30 21:13:36

标签: javascript angular typescript firebase angularfire2

我正在尝试在Angular Firebase / Firestore应用程序中构建上传功能。我正在使用本教程:

https://angularfirebase.com/lessons/firebase-storage-with-angularfire-dropzone-file-uploader/

从Atom的linter获取此错误消息:

Property 'downloadURL' does not exist on type 'AngularFireUploadTask'.

file-upload.component.ts的相关部分如下。请参阅标有ERROR HERE的代码。

import { Component, OnInit } from '@angular/core';
import { AngularFireStorage, AngularFireUploadTask } from 'angularfire2/storage';
import { AngularFirestore} from 'angularfire2/firestore';
import { Observable } from 'rxjs/Observable';

@Component({
  selector: 'app-file-upload',
  templateUrl: './file-upload.component.html',
  styleUrls: ['./file-upload.component.css']
})

export class FileUploadComponent implements OnInit {

  // Main Task
  task: AngularFireUploadTask;


  // download URL
  downloadURL: Observable<string>;

  // state for dropzone CSS toggling
  isHovering: boolean;

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

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

    ...

    // the storage path
    const path = `test/${new Date().getTime()}_${file.name}`;

    // The main task
    this.task = this.storage.upload(path, file, {customMetadata})

    // ERROR HERE 
    this.downloadURL = this.task.downloadURL();
  }

  ngOnInit() {
  }

}

1 个答案:

答案 0 :(得分:1)

从Firebase 5.0开始,上传任务中不再有downloadUrl。我们反映了AngularFire的变化。你必须从参考文献中获取网址。

import { storage } from 'firebase/storage';

...

const ref = this.storage.ref(path);
this.task = ref.put(file, {customMetadata})

this.downloadURL = this.task.snapshotChanges().pipe(
  filter(snap => snap.state === storage.TaskState.SUCCESS)
  switchMap(() => ref.getDownloadURL())
)