Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/380.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Angular cli在一个步骤中生成服务并包括提供程序_Javascript_Typescript_Angular Cli - Fatal编程技术网

Javascript Angular cli在一个步骤中生成服务并包括提供程序

Javascript Angular cli在一个步骤中生成服务并包括提供程序,javascript,typescript,angular-cli,Javascript,Typescript,Angular Cli,可以使用angular cli生成服务,并将其作为提供程序添加到app.module.ts中,或者使用ng g service命令中的特殊选项 当执行以下操作时: $ ng g service services/backendApi installing service create src/app/services/backend-api.service.spec.ts create src/app/services/backend-api.service.ts WARNING S

可以使用angular cli生成服务,并将其作为提供程序添加到app.module.ts中,或者使用ng g service命令中的特殊选项

当执行以下操作时:

$ ng g service services/backendApi
installing service
  create src/app/services/backend-api.service.spec.ts
  create src/app/services/backend-api.service.ts
  WARNING Service is generated but not provided, it must be provided to be used

在它旁边,(根据警告消息),我通常使用文本编辑器将它添加到app.module.ts上的provider部分:

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  imports: [
    ....
  ],
  providers: [BackendApiService],
  bootstrap: [AppComponent]
})

只需一个步骤就可以实现自动化?

实际上,在创建服务时,可以提供服务(或保护,因为也需要提供保护)

命令如下所示

ng g s服务/backendApi--module=app.module

编辑

也可以向功能模块提供,您必须为其提供所需模块的路径


ng g s services/backendApi--module=services/services.module
使用Angular CLI向Angular 4应用程序添加服务

Angular 2服务只是一个javascript函数及其相关属性和方法,可以(通过依赖项注入)包含在Angular 2组件中

要向应用程序添加新的Angular 4服务,请使用命令
ng g service serviceName
。创建服务时,Angular CLI显示错误:

为了解决这个问题,我们需要在
@NgModule
方法的
输入中提供对
src\app\app.module.ts
的服务引用

最初,服务中的默认代码为:


import { Injectable } from '@angular/core';

@Injectable()
export class ServiceNameService {

  constructor() { }

}
一个服务必须有几个公共方法

指定路径

使用模块ONE中的新文件夹创建服务


与Angular 5和Angular cli 1.7.0的公认答案相比,语法略有变化

ng g service backendApi --module=app.module

在Angular 5.12和最新Angular CLI中,执行以下操作

ng generate service my-service -m app.module
角度6+单例服务 对于Angular 6及更高版本的单例服务,其适用范围为:

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class UserService {
}
实际上,CLI
--module
开关用于在
app
级别注册服务,因为它不再需要修改
app.module.ts

这将创建上述代码,而无需指定模块

ng g s services/user

因此,如果你不想让你的服务成为一个单独的服务,你必须删除你自己编写的
中提供的
,然后手动将它添加到组件或延迟加载模块的
提供者中。“根”部分中提供的
当前似乎没有不生成的开关,因此您需要手动删除它。

在命令提示符中转到项目文件夹并执行以下操作:

ng g s servicename

在终端中运行以下代码

确保您位于terminal中的项目文件夹中

ng g s servicename --module=app.module

是否有一种方法可以在多个位置提供它?从6开始,--module标志已从
$ng g s
中删除。请参阅Simon_Weaver的答案。答案至少对angular 6不正确。检查@StuttonY的注释。将提供程序添加到模块不适用于angular 6。使用angular CLI创建服务只会生成该服务。将不提供该服务,必须提供该服务才能使用。有关删除的说明,请参阅。“从第6版开始关闭此操作创建服务的首选方法是在服务上指定应在应用程序根目录中提供服务。这是通过在服务的
@Injectable
decorator上将
providedIn
设置为root来完成的。使用此方法,模块是冗余的,因为服务永远不会获得注册表。”注册在
ngModule
“我刚刚检查了一个测试项目,我的答案仍然有效。有什么我遗漏的吗?我能看出的唯一区别是,你将在app/vs我的app/services中生成一个服务(在@Pablo Ezequiel询问的地方)。在我承诺执行ng命令之前,我经常在ng命令的末尾添加--help或--dryRun。学习和记住选项的好方法。请注意,dryrun小写字母不起作用!Simon_Weaver-干运行是另一种语法,您也可以在模块中提供服务:例如,在:UserModule
中提供服务。
ng g s servicename
ng g s servicename --module=app.module