I would have a generic component for comments. This component has complex graphics implications and I need reuse for two different context with the same data model. I want explain by an example. I have two different API for adding new comment to a list in A and B context. So I've:
AComponent with a list of comments and a button for adding one (or deleting).
BComponent with a list of comments and a button for adding one (or deleting).
Both use the same model (IComment) and graphics details but different API for creation/deletion.
Until now I handled this use case with an event emitter and I delegated the API call to the parents belong to A and B component.
But if the API return a validation error by server I want handler it in the component of the comment to show error graphics details. How I can do it? Better practice for this use case?
Use Data sharing between parent and child component. You are already sending the event from child to parent. Now, bind the property in parent component to pass the data (comments/error) to children components. You can 1) define 2 different @Input() variables for comment and HTTPErrorResponse models, or 2) define single Input variable, pass comments/error response from parent, differentiate the component and view to show according to the type of the Input.