如何让 Angular 个组件和服务更加 DRY?

How to make Angular components and services more DRY?

我发现自己 运行 在我的所有 Angular 应用程序中都遇到了同样的问题,而且我最难知道要 Google 解决什么问题。

问题:我觉得我写了很多组件和服务,它们做的事情非常相似,但我不太明白如何让它们更通用。在我的示例应用程序中,我有 candidates 和 employees 组件。每个都有相应的服务。

https://stackblitz.com/edit/angular-ivy-92xryd?file=src/app/app.component.html

我无法抗拒我可以编写类似于 HOF 的东西的感觉,它可以帮助我在某种程度上即时“生成”这些组件和服务。编写这些基本上执行相同 CRUD 类型操作的组件和服务感觉非常多余。而且它似乎抑制了可扩展性。我不确定我要找的到底是什么,但似乎我遗漏了什么。感谢您的帮助!

看起来候选人和员工有共同点,那就是“做人”。您可以提取常见的“人”组件来显示他们两个的详细信息。您还可以在某些 app-person 组件中使用 <ng-content><ng-template> 来添加特定于员工或候选人的额外内容,在这种情况下,HOST 组件指定应添加到每个员工或候选人的内容。