来自 Subject 的 Observable 发出第一个值为 null

Question

我正在尝试拥有一个基于 Subject 的可观察对象，以便每次 SUbject 发出时它都会更新。

出于某种原因，当尝试获取可观察对象的值时，第一个值始终为空，其余包含值。我期望检索可观察对象的最新发射值。我尝试过各种主题。我缺少什么？

...
  activeBookings$: Subject<Booking[]> = new BehaviorSubject<Booking[]>(null);
  activeBooking$: Observable<Booking> = this.activeBookings$.pipe(
    filter((bookings) => bookings?.length > 0),
    mergeMap((bookings) => this.getBookingById(bookings?.[0]?.id)),
    share()
  );
  i = 0;
  constructor(
    public http: HttpClient,
    public store: Store,
    public asyncPipe: AsyncPipe,
    public bookingStoreService: BookingStoreService
  ) {
    this.getBookings().subscribe((bookings) => {
      this.bookings$.next(bookings);
    });
    this.getActiveBookings().subscribe((bookings) => {
      this.activeBookings$.next(bookings);
    });
    this.getPreviousBookings().subscribe((bookings) => {
      this.previousBookings$.next(bookings);
    });
  }
...

这是我尝试获取最新值的地方：

...
    const booking: Booking = this.asyncPipe.transform(
      this.bookingService.activeBooking$
    );

    booking.status = status; //error: booking is null
...

Answer 1

您在这里使用了一个初始值为 null 的 BehaviorSubject:

activeBookings$: Subject<Booking[]> = new BehaviorSubject<Booking[]>(null);

您可以用一个空数组来初始化它，例如：

activeBookings$: Subject<Booking[]> = new BehaviorSubject<Booking[]>([]);

否则你的真实类型是：

activeBookings$: Subject<Booking[] | null> = new BehaviorSubject<Booking[] | null>(null);

你为什么得到 null ？ BehaviorSubject 需要用一个值初始化，这可能就是您获得的第一个值为 null 的原因。一个普通的 Subject 不需要包含一个初始值，你可能不会得到 null

activeBookings$: Subject<Booking[]> = new Subject<Booking[]>()

在不订阅其他服务的情况下获取最新值的一种更简洁的方法是利用 BehaviorSubject 的功能以及调用 activeBooking$.value 使您检索 BehaviorSubject 的最新值这一事实。转换您的 activeBooking$ 字段，使其成为一个 BehaviorSubject，当订阅 getActiveBookings() 的结果时，您可以执行当前在 activeBooking$ 定义管道中的计算，然后使用结果调用 activeBooking$ 的 next 并公开getter 用于您的其他服务：

get activeBooking(): Booking {
   return this.activeBooking$.value
}

来自 Subject 的 Observable 发出第一个值为 null

Observable from Subject emits first value as null

javascript

subject

observable

rxjs

angular