Question

我无法解决如何通过反应式编程实现以下问题的问题：

我想调用方法getSearchResults(searchterm: string): Observable<Foo[]>。在这种方法中，我通常从本地存储的dataset中过滤数据。仅当未加载此数据集时，我才想首先从服务器加载我的dataset：

getSearchResults(searchterm: string): Observable<Foo[]> {
  if(this.dataset != null) {
    return this.filter(this.dataset, searchterm);
  }

  // Load dataset first from server. service method returns an Observable
  const obs = myService.loadDataset();
  obs.subscribe(data => {
     this.dataset = data;

     // Now I want to call filter and return an Observable
     return this.filter(this.dataset, searchterm);
  });

}

将此视为伪代码，没有完整的示例，但我希望它可以使我的问题更清楚。我了解，这种方式无法正常工作。

但是我真的很难找到一种模式来实现这样的目标。

有帮助吗？

Answer 1

包括可观察到的rxjs import { Observable } from 'rxjs/Observable';

然后创建您自己的可观察对象。

    return Observable.create(observer => {
      const obs = myService.loadDataset();
      obs.subscribe(data => {
         this.dataset = data;

         // Now I want to call filter and return an Observable
         observer.next(this.filter(this.dataset, searchterm));
      });
   });

Answer 2

我认为您可以将observable转换为promise，例如：

async getSearchResults(searchterm: string): Promise<Foo[]> {
    if(this.dataset != null) {
        return await this.filter(this.dataset, searchterm). toPromise();
    }

    // Load dataset first from server. service method returns an Observable
    const data = await myService.loadDataset().toPromise();
 // Now I want to call filter and return an Observable
   return await this.filter(this.dataset, searchterm). toPromise ();
}

Answer 3

以下逻辑很容易实现目标：

localDataLoaded = false;

yourLocalDataAsObservable.pipe(
filter()
).subscribe(
data => {this.localDataLoaded = true;},
error => {},
() => {if (!localDataLoaded) {
// Load data from server, because the data you need is not in the local store
}}

）

Angular RX / JS嵌套可观察调用

3 个答案: