Emit event (or alternative) from grandchild component Angular 9

Question

I have structure like AngularJS application -> Angular component (main) -> child component -> grand-child component. There is click event happening on my grandchild component and I want to emit event to AngularJS application. I have added listner in my AngularJS application and if I emit event from main component, then it works, but not from grandchild. Chaining events every level up might be a solution but doesn't look optimized as there can be many such events. I read on some thread that it is not good practice to emit event from service (Still I tried in my case but anyways didn't work). Is there any other way?

Answer 1

take a look at RxJS Subject. in the grandChild whenever click event happens, do the subject.next(); then in the AngularJS application subscribe to it.