angular - Angular 中的通用组件，具有特定于多个上下文的创建/删除 API

Question

我会有一个通用的评论组件。该组件具有复杂的图形含义，我需要重用具有相同数据模型的两个不同上下文。我想通过一个例子来解释。我有两个不同的 API 用于向 A 和 B 上下文中的列表添加新评论。所以我有：

带有评论列表和添加（或删除）按钮的组件。
BComponent 带有一个注释列表和一个用于添加（或删除）的按钮。

两者都使用相同的模型 (IComment) 和图形细节，但用于创建/删除的 API 不同。

到目前为止，我使用事件发射器处理了这个用例，并将 API 调用委托给了属于 A 和 B 组件的父组件。

但是，如果 API 由服务器返回验证错误，我希望在注释的组件中处理它以显示错误图形详细信息。我该怎么做？这个用例的更好实践？

Answer 1

使用父子组件之间的数据共享。您已经将事件从孩子发送给父母。现在，绑定父组件中的属性以将数据（注释/错误）传递给子组件。您可以 1) 为评论和 HTTPErrorResponse 模型定义 2 个不同的 @Input() 变量，或 2) 定义单个 Input 变量，从父级传递评论/错误响应，根据输入的类型区分组件和视图以显示。