Angular4 switchMap

Question

在我的Angular 4应用程序中，是一个维护预订对象列表的服务，如下所示。此预订列表是一个主题。

    //imports

    @Injectable()
    export class BookingTreeService {
      selBooking: Booking;
      bookingList: Array<Booking> = [];
      bkgList$: Observable<Array<Booking>>;
      private bkgListSubject: Subject<any>;

      constructor( private resHttp: ResHttpService) {

        this.bkgListSubject = new Subject<Array<Booking>[]>();
        this.bkgList$ = this.bkgListSubject.asObservable();
      }

      loadBooking(bookingId:number): Observable<any> {
        let item = this.bookingList.filter(b => b.bookingId === bookingId);
        if (item && item.length > 0) {
         return this.retrieveBooking(bookingId); 
         // here, I don't want to call http call. Need to update the booking tree
        }
        else {
          return this.loadBookingAndLock(bookingId);
        }
      }

      loadBookingAndLock(bookingId: any): Observable<any> {
        return this.resHttp.loadBookingAndLock(bookingId)
          .map(response => {
            //handle response
          })
          .catch(this.handleError);
      }

      retrieveBooking(bookingId: any): Observable<any> {
        return this.resHttp.retrieveBooking(bookingId)
          .map(response => {
            //handle response
          })
          .catch(this.handleError);
      }

      addBooking(booking: Booking) {
        this.bookingList.push(booking);
        this.updateBookingTree(booking);
      }

      updateBookingTree(booking: Booking):void {
        this.bookingList.map((b:Booking) => {
          b.active = b.bookingId === booking.bookingId;
        });
        this.bkgListSubject.next(this.bookingList);
      }
    }

在组件中，我调用ngOnInit内部的loadBooking，如下所示。

loadBooking() {
    this.paramsSubscription = this.route.params
      .switchMap((params: Params) => this.bkgTreeService.loadBooking(+params['id']))
      .subscribe(
        response => {
        },
        (error) => {
          console.log(error);

        }
      );
  }

如果选择的预订已经包含在预订树中，则不想再次调用http请求，只想更新预订树。但是在switchMap内部，它只接受Observable。那么怎么处理呢？

如有任何建议，欢迎光临。

Answer 1

这里我所理解的是您想要缓存数据，因此您可以使用shareReplay的Rxjs缓存。

更多详细信息请访问:- https://blog.thoughtram.io/angular/2018/03/05/advanced-caching-with-rxjs.html

Answer 2

您必须在拨打电话时使用"tap“来存储预订列表

loadBookingAndLock(bookingId: any): Observable<any> {
    return this.resHttp.loadBookingAndLock(bookingId)
       //When the observable finished
       .pipe(tap(response=>{
              //we concat the response to the bookingList
              if (!this.bookingList.find(b=>b.bookingId==bookingId)
                    this.bookingList.concat(response);
            }))
       .catch(this.handleError);
      }