concept injectable service in category angular

This is an excerpt from Manning's book Angular Development with Typescript, Second Edition. Login to get full access to this book.

For cleaner code separation, we usually don’t use a component for code that fetches or manipulates data. An injectable service is the right place for handling data. A component may depend on one or more services. Chapter 5 covers how dependency injection works in Angular. Here, we’ll give you an idea of how services and components work together.

8.3.2. Using an injectable service as a mediator

In the last section, you saw how sibling components use their parent as a mediator. If components don’t have the same parent or aren’t displayed at the same time (the router may not display the required component at the moment), you can use an injectable service as a mediator. Whenever the component is created, the mediator service is injected, and the component can subscribe to events emitted by the service (as opposed to using @Input() parameters like OrderComponent did).