I have an Angular app where I'm trying to have a list of reservations downloaded from a server to an Angular service. I want to give all of the components the ability to get the reservation array as an observable and be able to filter and limit the results. Right now I'm using an BehaviorSubject. Here is my code.
//reservation.service.ts (partial code)
@Injectable()
export class TripService {
public Trips: Object[] = [];
public TripSubject: Subject<Object[]> = new BehaviorSubject<Object[]>([]);
public trips$: Observable<Object[]> = this.TripSubject.asObservable();
constructor(private apollo: Apollo) {
this.apollo.query({query: ReservationQuery}).subscribe((trips: any) => {
this.Trips = trips.data.allReservations;
this.TripSubject.next(this.Trips)
})
}
}
//partial component
ngOnInit(): void {
this.tripService.trips$.take(3).subscribe(trips => {
this.Trips = trips
})
}
I get the reservations to populate but I get all of them, not just the 3 I'm wanting by using the take(3). Is there a reason the take operator isn't working?