angular - 如何在角度组件之间共享功能？

Question

我有 3 种类型的组件来处理表单。他们是：

• EntityFormEditComponent //To Edit
• EntityFormViewComponent // To Visualize
• EntityFormCreateComponent // To Create

他们有一个共同的父母，即他们EntityFormComponent之间共享基本逻辑的父母。

当我创建一个新实体时，该实体从基本表单组件扩展，如下所示：

• UserFormEditComponent extends from EntityFormEditComponent
• UserFormViewComponent extends from EntityFormViewComponent
• UserFormCreateComponent extends from EntityFormCreateComponent

这种组织我的项目的方式会产生一个问题：

我如何在这 3 个组件之间共享常用方法？

我认为该服务将是一种解决方案，但不可推荐，因为它们不用于处理组件逻辑。

标签： angular

Answer 1

我认为该服务将是一个解决方案，但不推荐，因为它们不用于处理组件逻辑。？

Angular 将组件与服务区分开来，以增加模块化和可重用性。 将复杂的组件逻辑委托给服务是一种很好的做法

来自Angular Style Guide
将组件中的逻辑限制为仅视图所需的逻辑。所有其他逻辑都应委托给服务。

将可重用逻辑转移到服务中，并使组件保持简单并专注于其预期目的。

为什么？当放置在服务中并通过函数公开时，逻辑可以被多个组件重用。

为什么？服务中的逻辑可以更容易地在单元测试中隔离，而组件中的调用逻辑可以很容易地模拟。

为什么？从组件中删除依赖项并隐藏实现细节。

为什么？使组件保持纤细、整齐和集中。

在 Angular 中使用服务还可以确保您不违反软件开发的DRY和SRP 原则，对于您的场景，最好的解决方案是使用服务

奖金：what, why and when to use services?