Универсальный компонент в Angular с API создания / удаления, специфичным для нескольких контекстов

Question

У меня будет общий компонент для комментариев.Этот компонент имеет сложные графические значения, и мне нужно повторно использовать для двух разных контекстов с той же моделью данных.Я хочу объяснить на примере.У меня есть два разных API для добавления нового комментария к списку в контексте A и B.Итак, я:

AComponent со списком комментариев и кнопкой для добавления одного (или удаления).
BComponent со списком комментариев и кнопкой для добавления одного (или удаления).

Оба используют одну и ту же модель (IComment) и графические детали, но разные API для создания / удаления.

До сих пор я обрабатывал этот сценарий использования с источником событий, и я делегировал вызов API родителям.к компонентам A и B.

Но если API возвращает ошибку проверки сервером, я хочу обработать ее в компоненте комментария, чтобы показать детали графики ошибок.Как я могу это сделать?Лучшая практика для этого варианта использования?

Answer 1

Использовать обмен данными между родительским и дочерним компонентами.Вы уже отправляете событие от ребенка к родителю.Теперь свяжите свойство в родительском компоненте, чтобы передать данные (комментарии / ошибки) дочерним компонентам.Вы можете 1) определить 2 разные переменные @Input () для комментариев и моделей HTTPErrorResponse, или 2) определить одну переменную Input, передать комментарии / ответ об ошибке от parent, дифференцировать компонент и представление для отображения в соответствии с типом Input.