Question

去年，当我建立Alexa技能时，这就是我用来定义服务的方式：

service.ts

var createReport = function(variable,callback){
  //Method code here
        };
module.exports.createReport = createReport;

这就是我以前在：

中调用它的方式

app.ts

const service= require('../service.ts');
        servicee.createReport (name,function=> {
//Callback function code here
}
)

今年，我正在构建一个Angular应用程序，其中的服务操作与前面的示例不同。
这是我的角度应用程序中状态管理服务的示例：

service.ts

import { Injectable } from "@angular/core";
import { BehaviorSubject } from "rxjs";
@Injectable()
export class listOfThirdPartiesService {
  constructor() {}
  /************************************************** */
  private listOfThirdPartiesValuesSource = new BehaviorSubject<string[][]>([
    ['','','','','','','',''],
    ['','','','','','','',''],
    ['','','','','','','',''],
    ['','','','','','','',''],
    ['','','','','','','',''],
    ['','','','','','','',''],
    ['','','','','','','',''],
    ['','','','','','','',''],
  ]);
  currentListOfThirdParties = this.listOfThirdPartiesValuesSource.asObservable();
  /************************************************************************ */
}

这就是我在：

中的称呼方式

app.ts

import { listOfThirdPartiesService } from "../services/listOfThirdPartiesService.service";

同样在app.module.ts中，我必须在提供程序中声明它。
所以我的问题是：
两种实现服务的方式有什么区别？
在哪些用例中，我可以使用第一个和第二个？

Answer 1

在 Services

上查看此文档

您可以使用以下命令在Angular 2+及更高版本中轻松创建服务

ng generate service your-service

或者简单地

ng g s your-service

上面的命令也会自动将您的服务注册到模块中。

现在，如果您在NgModule的提供者中指定服务，如下所示，那么该服务将对该NgModule中的所有组件可用

@NgModule({
  providers: [
  YourService,
 ],
 ...
})

但是，如果您只想为某些组件使用服务，请在组件的提供者下指定该服务

@Component({
  selector:    'app-test',
  templateUrl: './app-test.component.html',
  providers:  [ YourService ]
})

Answer 2

对我来说，第一种方法似乎只是定义一个函数。这提供了功能和闭包。这实际上不是“服务”。

第二种方法（使用@Injectable()装饰器）使该类可注入。这意味着它将与Angular的DI系统一起使用。您可以通过将其与打字稿类型一起传递到构造函数中，将其注入其他Angular类（组件和服务）。 Angular编译器将查找其提供程序并找到这种类型的服务，您将可以访问该类的确切实例。您说您正在AppModule中提供此功能。这意味着您将在应用程序的根目录中提供此服务，并且该服务将是单例。实际上，此方法是最方便的。我尝试用my half baked blog中的图片对此进行解释。

使用第一种方法时，如果您关心在任何给定时间有多少个实例化以及与哪个实例进行交互，则需要注意如何导入它以及是否在进行代码拆分。 / p>

在Angular应用程序中实现服务的正确方法是什么？

2 个答案: