BehaviorSubject 只发出一次值

Question

我正在学习 rxjs，我想我做错了什么，因为我的 BehaviourSubject 只发出一次值。

在我的服务中 -

private cartItemCount = new BehaviorSubject<Observable<Number>>(this.getCartItemsCount());
actualCartItemCount=this.cartItemCount.getValue();

getCartItemsCount(){
return this.http.get<Number>('/api/getCartItemsCount/'+this.getCartID());
}

Below Method 也在上述添加或删除产品的服务中，但将从 ProductCartComponent 调用，并且在内部我调用 Behavior Subject 的下一个方法

private updateProductCart(cartID:string,productId:number,change:string){
this.cartItemCount.next(this.getCartItemsCount());
return this.http.get<Item>('api/updateProductItem/'+cartID+'/'+productId+'/'+change);
}

现在在我的 NavBar 组件中，我订阅了 actualCartItemCount Observable

constructor( private cartService:ShopingCartService)
 { }

ngOnInit() {
this.cartService.actualCartItemCount.
subscribe(res => {this.totalCartItemCount = res;
}

在控制台中，我可以看到 getCartItemsCount 会在添加或删除发生时被调用，但在我订阅了 actualCartItemCount 的 NavBar 组件中只会被调用一次。

请指导我，如果需要更多详细信息，请告诉我...

Answer 1

首先，仔细阅读component interaction guide。

如果 NavBar 始终在视图中，则不需要 BehaviorSubject，只需简单的 Subject 即可。

import { Injectable } from '@angular/core';
import { Subject }    from 'rxjs';

@Injectable()
export class CartService {

  // Observable number sources
  private countSource = new Subject<number>();

  // Observable number streams
  count = this.countSource.asObservable();

  // Service message commands
  updateCount(count: number) {
    this.countSource.next(count);
  }
}

在 NavBar 中，您可以使用 async 管道直接在模板中使用 observable：

@Component({
  selector: 'app-nav-bar',
  template: `Count : {{cartService.count | async}}`
})
export class NavBarComponent {
  constructor(private cartService: CartService) {}
  }

在产品购物车中，您可以更新新的计数，如下所示，它会更新 NavBar 或任何其他地方的值：

@Component({
  selector: 'app-product-cart',
  template: `
  `
})
export class ProductCartComponent {
  constructor(private cartService: CartService) {}
  /**
  Update count in the shared service and thus in NavBar
  */
  private updateCartCount(count: number){
     this.cartService.updateCount(count);
  }
  }