等待 observable 等待其中的其他 observable 响应。 Angular 异步

Question

我想达到什么目的？

我有多个组件具有几乎相同的检查和数据操作..我想将它们转移到一个可观察的..
我在我的服务中创建了一个可观察的名称“getData”...
扭曲是“getdata”有一个 if 检查.. -> 如果本地存储有数据则 return 数据。如果不是，则从 api call(getbyid) 请求数据然后操作它和 return 数据..

注意：我们无法更改 getbyid()。他们都在同一个服务中。

API

  getbyid(id: any): Observable<any> {
    return this.http.post<any>(this.serverurl, id )
    .pipe(tap((res) => { return res })); 

     
  }

我的代码

getData(origin: any, id:number):Observable<any> {
    let data= new BehaviorSubject({});
    if(origin=='main page'){
    let localstorage= this._aes.getItem('localstorage')

    if(!localstorage){  
      
      console.log('before api');
     
        this.getbyid(id).subscribe(res=>{
          console.log('res',res);
          data.next(res)
          return data.asObservable()
         })
      console.log('after api');
        
    }else{
      data.next({data:payload})
      return data.asObservable()
    }

    }
     
  }

当前情况：它只是点击 getbyid 而不是等待响应并继续...如果我们以某种方式让它等待响应，这可以解决。

Answer 1

在这种情况下你不需要BehaviorSubject。这样的东西应该可以工作（我假设“有效负载”是您存储的内容？）：

  getbyid(id: any): Observable<any> {
    return this.http.post<any>(this.serverurl, id));         
  }

  getData(origin: any, id: number): Observable<any> {
    if (origin !== 'main page') {
      return EMPTY;
    }

    const payload = this._aes.getItem('localstorage');
    return payload ? of(payload) : this.getById(id);
}

如果设置了 payload，我们 return 一个可观察对象。如果没有，一个带有后端调用的可观察对象。

在这两种情况下，您都必须从调用 getData 方法的地方订阅并等待响应。

等待 observable 等待其中的其他 observable 响应。 Angular 异步

wait observable for other observable in it to respond. Angular async

typescript

angular

angular10

angular11

angular12