在使用 AngularJS 1.x 框架开发 2 年后,我目前正在学习 Angular 框架(第 5 版),所以我问自己很多问题,其中一个是正确导入另一个模块提供的服务的方法那是我的申请之一。
假设我有一个提供 MyService
服务的 CoreModule
,假设该项目有以下文件树:
app/
app.module.ts
...
pages/
clients/
clients.component.html
clients.component.css
clients.component.ts
...
core/
core.module.ts
providers/
my-service.service.ts
现在假设我的clients
页面需要从CoreModule
模块注入(inject)MyService
服务。为此,我将把 MyService
放在 CoreModule
模块的提供程序列表中。我将在我的 AppModule
中导入 CoreModule
。
如果我很好理解,通过执行这样的导入,我会告诉我的应用程序在 AppModule
的 .ts 文件中需要时使用 MyService
服务> 模块。
但我无法理解的是在我的应用程序代码中包含声明服务的 .ts 文件。事实上,如果我想使用 MyService
服务,我会在我的 Clients
类中做类似的事情:
constructor(private service: MyService) {
// using of the injected service
}
但是 TypeScript 需要声明服务的 .ts 文件的引用。我的第一个尝试是按照文件树导入文件:
import { MyService } from '../../core/providers/my-service.service';
但这对我来说感觉不对,因为当我导入 Angular 服务时,我不必指定路径来访问声明相关服务的文件。 HttpClient
服务示例:
import { HttpClient } from '@angular/common/http';
实际上,我希望能够通过引用模块而不是通过传递 .ts 文件的路径来在我的应用程序页面中导入我的核心服务。
那时,我不知道这是否可能,或者我是否误解了其他模块的服务使用。
最佳答案
当你这样做的时候
constructor(private service: MyService) {
// using of the injected service
}
您正在向此类中注入(inject)依赖项。这意味着,Angular 将创建一个 MyService
类的实例,并在创建时将其传递给组件的构造函数。
当你这样做的时候
import { MyService } from '../../core/providers/my-service.service';
这只是告诉 TypeScript 这样的类存在,你指的是哪个类,并且还允许 TypeScript 正确地执行类型检查。它只不过是指向确切的 MyService
类位置的指针,因为您可能在不同的文件中有多个具有此类名称的类。
我不会说 HttpClient
是一个服务,只是一个普通的类助手。
因此,所有的工作仍然在构造函数声明级别完成。这是为了 Angular 和依赖注入(inject)。额外导入主要针对 TypeScript。
关于typescript - 从另一个模块导入服务,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47521414/