Angular 8 学习（五服务）

朴灿烈づ我的快乐病毒、 2024-04-17 16:14 69阅读 0赞

# 服务： #

其实服务很好理解，据这么个例子，如果每个组件都有一个相同的方法，没回都要写太麻烦了，有的人就想组件之间相互调用，这样是行不通的，但是组件可以调用服务里面的方法。

看到这里是不是很像java中的util类（我感觉很像，手动滑稽）

而服务就提供了解决的办法，他将公共的方法进行封装，这样就可以在组件中调用这个公共的方法

## 来吧，创建一个组件吧 ，啊呸，服务 ##

和组件创建的方法一样，命令行进行创建

ng  g  service  服务名称

![20190828154223688.png][]

创建完成后的目录是这样的：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70][]

第一个就是组件，第二个就是服务，

里面是这样子的

![20190828154340684.png][]

## 创建完成就可以用了？？？？nonono 不行 ##

和组件一样，他需要进行引入和配置。

（什么？你说在创建组件的时候没有引入和配置，拉到吧，肯定是需要的，只不过是在创建组件的时候，自动进行引入和配置

，服务却需要手动的进行操作，gogogogog）

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 1][]

这样就在根模块中引入了，但是在组件中使用要在每个组件中进行单独的引入

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 2][]

你只需要关注框起来的东西，其他的不用管，我只是懒得删而已：

![20190828154943226.png][]

这个相当于java中的构造函数，在这里写了，可以在其他方法中使用

下面是我服务中的方法：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 3][]

下面就是我组件方法的调用

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 4][]

看吧，是不是很想一个java的util类

[20190828154223688.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/d4135a0a6e0047b8b6c887c33d421c30.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/30c9a31ad1524f6aa53e850612cb2ee7.png
[20190828154340684.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/19fc5d7848284defbd46d80cedb9a656.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/297d2b475d174ca19265ec6d2809c22a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 2]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/2695dc5183534e9c9d4fc84a51de4974.png
[20190828154943226.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/f52350561d664d42b2712e29825f183b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 3]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/3a9616447b3e417b9e759329e7957b4d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x1b2RvbmcxNTAx_size_16_color_FFFFFF_t_70 4]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/cf17ec1ee2494752982f89f697feebf9.png