角2のネストされた観察可能なループ

Question

私はhttp apiに対して2つの観察可能な作業をしています。
1つは場所を要求し、2つ目はイベントを要求します。

イベントを尋ね一つはのハッシュを返します。

place_id => events_arr 

をし、自分のコードが

<ng-container *ngFor="let place of placesData"> 
    <ion-item> 
    <h1>{{place.name}}</h1> 

     <ion-slides> 
     <ng-container *ngFor="let event of eventsData[place.id]"> 
      <ion-slide> 
      <h1>{{event.title}}</h1> 
      </ion-slide> 
     </ng-container> 
     </ion-slides> 
    </ion-item> 
</ng-container> 

示して私の問題は、観察placesDataがeventsDataよりも高速であるということですので、eventsData[place.id]は、次の例外が発生します：

TypeError: Cannot read property '12' of undefined 

Aいい考え？

Answer 1

オプション1は、すでに@mickdevがコメント経由で指し示されているように*ngIfを使用することです。

オプション2は、forkJoin()を使用することになります。

Observable.forkJoin(
    yourPlacesFunctionReturningAnObservable(), 
    yourEventsFunctionReturningAnObservable()) 
.subscribe(result => { 
    this.placesData = result[0]; 
    this.eventsData = result[1]; 
}); 

forkJoinすべての観測値が完了するまで「待機」します。

ドキュメント：そうhttps://www.learnrxjs.io/operators/combination/forkjoin.html

：https://stackoverflow.com/a/42373283/3631348