从Observable <string>获取字符串

Question

我得到一个名为Observable<string>的{​​{1}}，调用我的数据库后，它会得到以下值：

我想通过以下方法获取其值：

this.downloadURL

尽管如此，即使我在控制台中看到该值，也无法访问此变量，并且在 //Upload a new picture to the database as a profile picture uploadBetPicture(event) { const id = "bet_" + Math.random() .toString(36) .substring(2) + "_Photo"; this.ref = this.afStorage.ref(id); this.task = this.ref.put(event.target.files[0]); this.downloadURL = this.task.downloadURL(); //UNTIL HERE I HAVE JUST STORE THE PICTURE AND SET THE OBSERVABLE //HERE I GET THE ERROR this.photoUrl = this.downloadURL.value; } 中出现以下错误

  

“可观察”类型不存在属性“值”。

只需添加存储方法即可，就像我之前说的，我得到了this.photoUrl = this.downloadURL.value

Answer 1

由于this.task.downloadURL()是可观察的，并且您的downloadURL被包裹在该Observable中的某个地方，因此您必须subscribe对其进行解包。

尝试一下：

uploadBetPicture(event) {
  const id =
    "bet_" +
    Math.random()
    .toString(36)
    .substring(2) +
    "_Photo";
  this.ref = this.afStorage.ref(id);
  this.task = this.ref.put(event.target.files[0]);
  this.task.downloadURL()
    .subscribe(value => this.photoUrl = value);
}

注意：

从Observable解开的值中可能还包含其他一些键，因此您可能需要先将value块内的subscribe记录到console，然后使用key对象中的相应value。

Answer 2

查阅RxJs文档，您会发现Angular形式的react非常有用，因为您要做的不只是订阅并等待异步回调。

例如，您可以查询可观察对象中的第一个值：

YourObservable.first()

http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-first

或最后一个值：

YourObservable.last()

http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-last


完整的Observable文档在这里：

http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html