如果组件中没有直接提供服务，则 `ng serve` 会失败

Question

我有一个结构如下的项目：

project
-src
--app
---project
----project.component.ts
----project.component.html
----project.component.sass
---project.module.ts
---project.service.ts

我正尝试在我的组件中使用该服务：

constructor(private ProjectService: ProjectService) {
    this.ProjectService = ProjectService;
}

但是当我运行 ng serve 它没有说 ERROR in /Users/jrquick/uabshp/project/src/app/project/project.component.ts (9,49): Cannot find name 'ProjectService'

即使我在 project.module.ts 文件中有服务：

import { ProjectService } from './project.service';

@NgModule({
    declarations: [
        ProjectComponent
    ],
    imports: [
        BrowserModule,
        FormsModule,
        HttpModule
    ],
    providers: [
        ProjectService
    ],
    bootstrap: [
        ProjectComponent
    ],
    exports: [
        ProjectComponent,
        ProjectService
    ]
})

我已经尝试将它添加到我的组件注释的提供者数组中，但我更希望该服务是单例使用的。我也可以直接在 project.compontent.ts 文件中导入服务（如下所示），但是必须在模块以及多个组件和服务中复制和粘贴相同的导入语句并不理想。

import { ProjectService } from './project.service';

project.service.ts声明：

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

@Injectable()
export class DefaultVariableService {
    constructor() {

    }

   ...
}

Answer 1

试试这个，因为您尝试从 ProjectComponent 所在的同一文件夹中导入 ProjectService。您在 project.component.ts 中导入 ProjectService 应该看起来像

import { ProjectService } from '../project.service';

其次，你为什么使用奇怪的东西，比如：

constructor(private ProjectService: ProjectService) {
    this.ProjectService = ProjectService;
}

这是什么目的？！我认为它应该看起来像：

constructor(private projectService: ProjectService) {

}

仅此而已！您可以通过以下方式在您的组件中使用此服务：

this.projectService.someMethod()

如果组件中没有直接提供服务，则 `ng serve` 会失败

`ng serve` fails if service is not provided directly in component

angular2-injection

angular