Question

我在angular 6应用程序中使用rxjs，并且正在构建一个具有Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined}的组件，当我从firebase存储中获取url时就会填充该组件。

我需要分配一个初始值，该初始值使用downloadUrl: Observable<string>传递给组件，并且我尝试将一个值发送给downloadurl为（在@Input attribute (@Input imagesrc:string)中）：

ngOnInit

但是，这是不正确的，因为我收到未定义let emitter; this.downloadURL = Observable.create(e => emitter = e) emitter.next(this.imagesrc);的控制台错误消息。我如何能够手动将emitter的值发送到downloadURL？

Answer 1

我不太了解您在那里的实现。

比方说，这是您的FileService：

import { AngularFireStorage } from '@angular/fire/storage';
import { Injectable } from '@angular/core';
import { from, Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class FileService {

  constructor(private storage: AngularFireStorage) { }

  upload(path: string, file: File): Observable<string> {
    return from(this.storage.upload(path, file))
      .pipe(switchMap(_ => this.storage.ref(path).getDownloadURL()));
  }

  delete(downloadUrl) {
    return this.storage.storage.refFromURL(downloadUrl).delete();
  }

}

假设您要公开一个初始值为this.imagesrc的Observable，然后在获取下载网址后，想要更新此Observable的值，则可以尝试以下方法：

private emitter: BehaviorSubject<string> = new BehaviorSubject<string>('');
emitter$: Observable<string> = this.emitter.asObservable();
...
constructor(private fileService: FileService) {}
...
ngOnChanges() {
  this.emitter.next(this.imagesrc);
}
...
functionWhereYouAreExpectingDownloadUrl() {
  ...
  this.fileService.upload(pathToStoreTheFileAt, fileToStore)
    .subscribe(downloadUrl => this.emitter.next(downloadUrl));
}

在这里，我们正在创建一个BehaviorSubject<string>，可以使用this.imagesrc对其进行初始化。但是我们保留了private，并公开了asObservable。然后，一旦我们得到downloadUrl，我们就在发射器上调用next，将新值推送到我们的emitter$ Observable

手动向可观察对象发出值

1 个答案: