Как упорядочить несколько наблюдаемых

Question

Я новичок в разработке Angular2 и в интерфейсе в целом, поэтому приношу свои извинения, если мне не хватает очевидного ответа.

Я работаю над приложением Angular2. Я не уверен в наилучшем способе выполнения задачи в компоненте, над которым я работаю.

ngOnInit() { 
    console.log("init component"); 
    console.log(this.activatedRoute); 

    this.paramSub = this.activatedRoute.params.switchMap(
     (params: Params) => this.personSearchService.getPerson(params['personId'])) 
     .subscribe(result => this.personDetails = result); 

    this.orgSub = this.personSearchService.getPersonFedOrgs(0).subscribe(
     results => this.orgs = results, 
     error => console.log(error) 
    ); 

    //pseudo-code 
    watch this.orgs and this.personDetails 
     if change 
      do logic 
} 

В OnInit lifecyle крючок, я сделать две вещи, я получаю и использовать параметр маршрута с сервисом, и я также получить список организаций из второго сервиса. Все это прекрасно работает.

Раздел, который я назвал psuedo-кодом, - это функциональность, которую я хочу добавить. Я хочу принять результаты первых двух вызовов службы и выполнить некоторую бизнес-логику.

Я знаю, что я не могу напрямую использовать this.personDetails и this.orgs, потому что они будут неопределенными (пока асинхронные вызовы не будут разрешены). Поэтому я думаю, что мне нужно обернуть их в Observable, чтобы я мог выполнять некоторую логику каждый раз, когда они обновляются. Но я не совсем уверен, как это сделать. Любые указатели в правильном направлении были бы весьма полезны.

Answer 1

Оператор cobmineLatest(). Я переработан код немного для удобства чтения:

personDetails$ = this.activatedRoute.params 
    .map((params: Params) => params['personId']) 
    .switchMap(id => this.personSearchService.getPerson(id)) 

orgs$ = this.personSearchService.getPersonFedOrgs(0) 

Observable.combineLatest(personDetails$, orgs$) 
    .subscribe(([details, orgs]) => { 
    console.log(details, orgs); 
    }) 

Не забудьте импортировать оператор:

import 'rxjs/add/observable/combineLatest'; 

Answer 2

CombineLatest делает работу, за исключением того, что излучал бы значение, если любой из потоков испустил любое значение, поэтому вы не можете быть уверены, что получите уведомление, когда оба из них действительно испустили значения.

Для этого вам нужно застегнуть их: d

this.paramSub = this.activatedRoute.params.switchMap(
     (params: Params) => this.personSearchService.getPerson(params['personId'])); 

    this.orgSub = this.personSearchService.getPersonFedOrgs(0) 


Observable.zip(this.paramSub, this.orgSub) 
    .subscribe(result) => { 
    console.log(result); 
    })