Question

我有两个不同的HTTP调用的两个observable。在我的组件中，我需要调用这两个服务，处理从这些服务返回的数据，并将另外两个变量发送到模板。

我尝试了很多我不能把它们全部放在这里的东西，但这是迄今为止我尝试过的主要解决方案：

在2个服务上使用forkJoin然后处理数据：执行该过程的函数表示结果未定义。
使用switchMap：与上面结果相同。
使用BehaviorSubject：同样的结果

我不知道我是否忘记了Observable或RxJs的基本规则，但我真的找不到正确的方法。

这是我组件中的当前代码：

  public notifGroups: any;
  public currentUser: any;
  public currentUserGroups: any;
  public notifGroupsImOut: any;

  private _notifGroupsImIn: BehaviorSubject<any> = new BehaviorSubject([]);

  public readonly notifGroupsImIn: any = this._notifGroupsImIn.asObservable();

  constructor(
    private _groupService: GroupService,
    private _currentUserService: CurrentUserService,
    private _userService: UserService,
  ) { }



  ngOnInit() {
     this.test().subscribe(
     res => {
      console.log(res);
      for(let mGroup in res[1]["user"]["subscriptionsToGroups"]){
        for(let nGroup in res[0]["list"]) {
          console.log(nGroup);
          console.log(mGroup);
          if (mGroup["group"]["email"] == nGroup["email"]){             
             this._notifGroupsImIn
                .next(this._notifGroupsImIn.getValue().push(nGroup));
          }
        }
      }
      this.notifGroupsImIn.subscribe()
    }
  )
}



  private _getNotifGroups(): any{
    return this._groupService
      .getGroupsByType('NOTIFICATION')
  }

  private _getCurrentUser() {
    return this._currentUserService
      .getCurrentUser()  
  }

  public getAll(){
    return Observable.forkJoin(this._getNotifGroups(), this._getCurrentUser())
  }

  public test(): Observable<Array<any>> {
     let obs = this.getAll();

     obs.subscribe(
         res => {
            console.log(res);
            this.notifGroups = res[0]["list"];
            this.currentUser = res[1]["user"]["subscriptionsToGroups"];
       }
    )
    return obs
 }

我知道代码的某些部分现在非常脏，但我希望你不要太多。

所以我要做的是：

我从两个服务中获得以下值：notifGroups和currentUserGroups。

它们都是对象列表。

然后在我的test（）函数中，我将每个对象与另一个对象进行比较，如果该对象的email属性等于另一个，我将它添加到notifGroupImIn。

但是当调用test（）函数时，看起来http调用的结果还没有解析，即使我在ngOnInit中调用它们并订阅它们。

我不确定我是否可以理解，所以请告诉我。

感谢。

更新

我已经改变了一些我的代码，因为在模板中，notifGroupsImIn仍然是一个可观察的。现在我有以下错误：无法读取undefined的属性'email'。引发错误的电子邮件属性是两个中的一个：

if (mGroup["group"]["email"] == nGroup["email"]){                  
  this._notifGroupsImIn.next(this._notifGroupsImIn.getValue().push(nGroup));
}

另外，两行

console.log(nGroup);
console.log(mGroup);

在控制台中都返回0，无法确定原因，因为res[1]["user"]["subscriptionsToGroups"]和res[0]["list"]正确返回了一个对象列表

Answer 1

forkJoin

的简单示例

@Component({
  selector: 't-root',
  template: `
    <div>{{groups}}</div>
    <div>{{user}}</div>
  `
})
export class AppComponent {

  groups: any;
  user: any;

  // Assume this method calls this._groupService.getGroupsByType('NOTIFICATION')
  private _getNotifGroups(): Observable<any> {
    return Observable.of('GROUPS');
  }

  // Assume this method calls this._currentUserService.getCurrentUser()  
  private _getCurrentUser(): Observable<any> {
    return Observable.of('USER');
  }

  private getAll(): Observable<any> {
    return Observable.forkJoin( this._getNotifGroups(), this._getCurrentUser() );
  }

  ngOnInit(): void {
    this.getAll().subscribe(res => {
      console.log(res); // ['GROUPS', 'USER']
      this.groups = res[0];
      this.user = res[1];
    });
  }

}

Answer 2

您是否尝试过combineLatest

combineLatest ：只要任何可观察序列产生元素，就可以使用选择器函数将指定的可观察序列合并为一个可观察序列。

public getAll(){
   return Observable.combineLatest(
       this._getNotifGroups(), 
       this._getCurrentUser()
   );
}

combineLatest Docs

如果不起作用，请提及错误或错误原因。

处理数据取决于倍数可观察量

2 个答案: