This tutorial teaches how to make Angular component communication simpler, easier, and robust.

Lately, I was working on a project where we had too many component communication requirements.

The following were the possible solutions to achieve our goals:

  • Parent/Child components could communicate using @Input and @Output
  • Using the RxJs’s Subjects for component communication, not having the parent/ child relationship

We proceeded with creating only @Outputs and Subjects, but later in the development cycle, we realized that we ended up having too many @Outputs and Subjects created and listened for each type of communication we had.

To simplify this equation a bit, we created a simple yet powerful service to handle the component communication. The idea was, instead of creating multiple Subject or Input/output setups, to create one service that can broadcast messages to all of the listeners, and observers can decide if the broadcasted message is interesting or not.

#javascript #angular #web-development #programming #developer

Angular Component Communication
2.10 GEEK