Angular, Software Development

Inter-component communication using EventEmitter in Angular

This post demonstrates how to send messages from different components to the AppComponent using EventEmitter.  We have 3 components – AppComponent, AnotherComponent, and YetAnotherComponent. We also have a service that holds an instance of EventEmitter.

The Codes


We have a single service that is used by all the components.

Our  app.module.ts



For AppComponent, we set the default message and a way for it to also set the message to its original value.


In this component, we have the onClick function to send a different message to AppComponent.


Another component that sends another message to AppComponent.


We are using Angular 8.

Got comments or suggestions? We disabled the comments on this site to fight off spammers, but you can still contact us via our Facebook page!.

You Might Also Like