0

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?

70X
  • 320
  • 1
  • 5
  • 14

1 Answers1

1

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.

Learning
  • 1,333
  • 16
  • 24
  • Finally I pass an "ISubject" from parent A/B to nested "comment" component child. This style seems to me causes confusion in the code, but I did not know it was a best practice. Thanks for the reply. – 70X Sep 20 '18 at 14:35