0

저는 Angular4 앱을 만들고 있습니다. 여기 다른 방법으로 관찰 가능 데이터를 사용하는 방법은 무엇입니까?

난에 다음 데이터 -

export class BookingService { 

    constructor(private http: HttpClient) {} 

    getMemberBookings(memberID: number): Observable<any> { 
    return this.http.get('http://myapi.com/bookings/member/'+memberID).map(response => response['bookings']); 
    } 
} 

를 얻기 위해 사용하고있는 서비스입니다 내 컴포넌트 -

export class PrintButtonComponent implements OnInit { 

    bookings: any; 

    constructor(private service: BookingService) {} 

    ngOnInit() {} 

    downloadPDF() {  
      this.getBookings(memberID); 

      //pdf creation logic 
    } 

    getBookings(memberID: number) { 
      this.service.getMemberBookings(memberID).subscribe(data => this.bookings = data);  
    } 

} 

문제 난의 서비스에서 데이터를 사용하고자하는 것입니다 downloadPDF 메소드에는 PDF를 작성하는 데 필요한 다른 데이터가 있으므로 하지만 구독에서 데이터를 반환하거나 속성에 설정하면 정의되지 않은 상태가됩니다. 이 비동기 성격으로 인해 이해하지만, 구독 메서드 내에 내 PDF 생성 논리를 넣고 싶지 않아. 그러면이 문제를 어떻게 해결할 수 있습니까? 저는 Angular와 observables에 새로운 경험이 있습니다. 감사합니다.

답변

0

위의 코드는 관찰에 여러 값을 포함하지 않고 별도의 중첩으로, 이것은 async..await 함께 할 수있는 그들에 충실 필요로하지 않기 때문에 : 다른 RxJS 연산자로

async downloadPDF() {  
     await this.getBookings(memberID); 

     //pdf creation logic 
} 

async getBookings(memberID: number) { 
     this.bookings = await this.service.getMemberBookings(memberID).toPromise(); 
} 

, toPromise을 가져와야합니다.

+0

감사합니다. 그러나 '관찰 가능한 다중 값'은 무엇을 의미합니까? 그리고 observable-subscriber 방법으로 이것을 할 수있는 방법이 없을까요? – doctorsherlock

+0

약속은 그것이 해결할 수있는 하나의 값을 가질 수 있습니다. 관측 대상은 여러 개의 방출 값을 가질 수 있습니다. HttpClient에는 완성 된 값이 하나뿐이므로 약속으로 안전하게 바꿀 수 있습니다. 이것을 관찰 할 수는 있지만 "subscribe"안에 'pdf 생성 논리'를 옮겨야합니다. – estus