Angular 角度2：没有（注入）服务的提供者

我的应用程序中有两项服务-Main服务和RightClickService。只有MainService在应用程序中全局可访问，并且RightClickService被注入MainService。因此，我将以下文件定义为：

应用程序模块.ts

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [MainService],
  bootstrap: [AppComponent]
})
export class AppModule { }

 @Injectable()
 export class MainService {

  constructor(private rightClickService: RightClickService) {
    console.log("Constructor is init");
  }
}

app.module.ts中未提及RightClickService

服务.ts

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [MainService],
  bootstrap: [AppComponent]
})
export class AppModule { }

 @Injectable()
 export class MainService {

  constructor(private rightClickService: RightClickService) {
    console.log("Constructor is init");
  }
}

RightClickService仅存在于大型应用程序RightClickComponent中名为的一个组件中

右键单击.component.ts:

@Component({
  selector: 'right-click',
  template: `
    ...
  `,
  styleUrls: ['...'],
  providers: [RightClickService]
})
export class RightClickComponent implements OnInit {

  constructor(private rightClickService: RightClickService) {}

}

尽管如此，我还是得到了一个错误：

EXCEPTION: No provider for RightClickService!

---

你知道我做错了什么吗

除了已经说过的，你还必须知道两件事：

您的应用程序只有一个根注入器，其中包含

@NgModule中的所有提供程序。提供程序

应用程序中任何模块的数组，包括

AppModule

每个组件都有自己的注入器（根注入器的子注入器），其中包含在组件的

@Component.providers

数组中声明的提供程序

当angular想要解析服务（MainService）的依赖项（RightClickService）时，它会在包含所有模块的提供者的根注入器中查找它

当您想要解析组件的依赖项（RightClickService）时（RightClickComponent）如果未找到，则在组件注入器中查找。如果未找到，则在父组件注入器中查找。如果未找到，则将执行相同操作，直到到达根注入器。如果未找到，则将抛出错误

如果要解决此问题，可以执行以下操作：

function MainServiceFactory(RightClickService) {
    return new MainService(new RightClickService());
}

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [
   {
     provide: MainService,
     useFactory: MainServiceFactory,
     deps: [RightClickService]
   }
],
  bootstrap: [AppComponent]
})
export class AppModule { }

---

我只是把它放进了一个小盒子，除非我打错了什么。。。你所拥有的似乎很有用。那么，也许还有别的问题

你可以在这里查看plunker吗：

（这个工具不允许我在没有代码的情况下发布……但是你已经有了上面的代码……所以我只是粘贴了一部分。）

---

更改为

（private rightClickService:MainService）

什么？为什么？在何处更改它？

MainService

找不到

RightClickService

的提供程序，因为您没有在ngmoduley中提供它服务的导出类是nameMainService@CrazySynthax，您的

MainService

将在之前创建，您在此处有比赛条件，您不能使用

main服务

，因为它取决于您的

右键单击服务

。感谢您对这一点的详细解释；我在尝试将一个服务注入另一个服务时遇到了类似的问题（这两个服务都需要考虑ModuleWithProviders配置），这确实澄清了DI级别发生了什么，以及为什么没有正确找到和解决提供程序。