2017-03-01 17 views
2

http api에 대해 두 가지 관찰 가능한 작업이 있습니다.
하나는 장소를 요청하고 두 번째는 이벤트를 요청합니다.각도 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> 

내 문제가 관찰 placesDataeventsData보다 더 빠르다는 것을 보여줍니다, 그래서 eventsData[place.id] 다음과 같은 예외가 발생 :

TypeError: Cannot read property '12' of undefined 

그럴 생각이야?

+2

빠른 작은 해킹 '<이온 슬라이드 * ngIf = "eventsData"> ...'? – mickdev

답변

4

옵션 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