Search⌘ K

Subscribing to Observables

Explore how to subscribe to observables in Angular components to receive and manage emitted data reactively. Understand best practices for organizing subscription logic separately from lifecycle hooks and see how this approach supports the Angular HTTP client and application updates.

We'll cover the following...

We learned that an observer needs to subscribe to an observable in order to start getting emitted data. Our products and product-view services currently emit product data using observables. We must modify their respective components to subscribe and get this data:

  1. Open the product-list.component.ts file and create a getProducts method in the ProductListComponent class:

TypeScript 4.9.5
private getProducts() {
this.productService.getProducts().subscribe(products => {
this.products = products;
});
}

In the preceding method, we subscribe to the ...