angular中的服务的理解以及使用

1.angular中service的创建

通过命令 ng g service 服务名称

或者 ng g service services/服务名称

可以创建 服务名称.service.ts 的文件

2.service的使用

2.1 首先需要在根模块中设置,

首先需要导入服务

inport { storageService } from './service/storage.service'

其次在@ngModule的providers中添加

providers:[storageService ]

2.2 在组件中使用

需要导入 ----> 注册 -----> 使用

import {StorageService} from '../../services/storage.service'

导入的StorageService是一个类可以通过两种方式进行注册使用

第一种: 在构造函数中使用

// 依赖注入  storage就相当于StorageService的实例
constructor(public storage: StorageService) {
    console.log(this.storage.get())
    this.keyWord= this.storage.name
   }

这种方式称作依赖注入 (依赖注入就是一种创建实例的方式,通过程序创建,可以是全局的,也可以是局部的)

第二种:普通创建实例

// 普通创建实例
constructor() {
    const storage= new StorageService()
    console.log(storage.name)
   }

总体而言比较推荐第一种的使用

3.对service的理解

angular中的service感觉上相当于vue中的vuex,也是一个状态管理器,可以在service中定义一些方法或者数据,在组件内进行使用,区别在于使用上service使用的时候需要在根模块中@ngModule下的providers中注册,在组件中使用的时候也需要引入.因为引入的是一个类,所以需要在构造函数construct中进行实例化,两种方式,一种是通过new 普通的实例化,一种是通过依赖注入, public storage: StorageService 使用的时候直接this.storage就可以了