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
    ]
})

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

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”将失败

1 个答案: