Subcribe doesn`t update view in Angular

Question

I have.subscribe() in my Body.component.ts

ngOnInit(): void {
    this.pizzaSub = this.postService.getPizzas()
          .subscribe((pizzas: IPizza[]) => {
              this.pizzas = pizzas;
          });
}

and service post.service.ts that should update my body view

getPizzas(params?: Array<number | string>): Observable<IPizza[]> {
  return this.http.get<IPizza[]>(`http://localhost:3000/pizzas?${[params]}`);
}

But on click in another component it doesn`t happens

onPizzaClick(pizzaType: number): void {
    this.postService.getPizzas([`category=${pizzaType}`]);
}

I need to update data in body view on clicking in another component

Answer 1

You are not subscribing to the Observable in onPizzaClick function:

onPizzaClick(pizzaType: number): void {
    this.postService.getPizzas([`category=${pizzaType}`]).subscribe(
      (pizzas: IPizza[]) => {
             //Do whatever you want with pizzas
          }
 );
}

Answer 2

As fas as I understood, you should handle the data inside your service with a Subject, whenever you received your data, you update the Subject to notify your component who subscribe to this Subject about new data.

Your service

pizzas$ = new Subject();
getPizzas(params?: Array<number | string>): Observable<IPizza[]> {
  return this.http.get<IPizza[]>(`http://localhost:3000/pizzas?${[params]}`);
}

updatePizzas() {
 this.getPizzas().subscribe(pizzas => this.pizza$.next(pizzas))
}

Your component

ngOnInit(): void {
    this.postService.pizza$.subscribe(pizzas => // Do what you want with your pizzas here);
}