Angular 组件使用来自不同模块的多个服务答案

【问题标题】：Angular component uses multiple services from different modulesAngular 组件使用来自不同模块的多个服务
【发布时间】：2018-12-04 19:12:21
【问题描述】：

我很难为以下问题找到一个好的解决方案（如果这是一个问题）。

例如，我有一个具有不同模块的应用程序，例如：所有者、位置和汽车。

现在我正在构建一个可以搜索汽车的“搜索”组件。搜索汽车的逻辑在 car 模块的 car.service 中。

但是，当找到汽车时，我还必须设置位置，因此 location 模块中的 location.service 也用于搜索组件中，以根据给定 ID 查找位置。

所以现在我有一个需要 location.service 和 car.service 的搜索组件。

这感觉有点像一个不好的做法？有没有针对此类问题的解决方案。或者这对于 Angular 组件和服务来说很常见吗？

【问题讨论】：

我不会说有一个需要位置和汽车服务的 searchComponent 很糟糕。在 locationService 中设置位置（状态）适用于小型项目。当您的项目变得越来越大时，您可能会考虑使用像 ngrx 或 ngxs 这样的状态管理库。

【解决方案1】：

您的组件应该处理您的视图逻辑。这意味着它们应该处理按钮单击、表单等。

当你有业务逻辑时，你应该使用服务。就您而言，您做得很好，为数据模型的每个“类”创建了 3 个服务。

现在，您错过的是您的组件中不需要 2 个依赖项：您只需要一个。

您已经构建了汽车的搜索组件 → 您需要对汽车服务的依赖。就这样。

您要做的是调用服务，搜索您的汽车，然后在您的服务中，设置位置（意味着您的汽车服务依赖于位置）。

这背后的逻辑很简单：假设明天，您还想通知卖家有人在找他们的车。你会怎么做？你会为你的组件添加第三个依赖吗？

没有。您要做的是将组件保持原样，并向您的服务添加依赖项。

现在，第二天，您决定从 Firebase 切换到 Parse，因为它是免费的。你的情况会怎样？你必须改变你的组件依赖？

在我的情况下，您的组件保持不变。只有您的汽车服务会将其依赖项从 firebase 更改为 parse。因为该组件不关心您使用的是哪个提供程序，它只想搜索汽车。

这种做事方式允许您创建可以在同一个应用程序或其他应用程序中重复使用的组件和服务。

【讨论】：

谢谢。所以如果我理解正确的话。在 car.service 中完成搜索后，我可以调用 car.service 中的 location.service 来搜索正确的位置并进行设置？ :)
没错。调用位置服务取决于您的汽车服务，而不是组件！

【解决方案2】：

我也是 Angular 的新手。我认为从其他模块导入服务是正常的。但是，在我的项目中，我创建了一个文件夹名称_services，用于存储项目的所有服务。接下来，我创建一个文件名index.ts：

export * from './authencation.service';
export * from './alert.service';
export * from './notebook.service';

当我需要进口服务时，我会致电import { StatisticSerivce, AlertService, UserService } from '../../../_services/index';

【讨论】：