-1

我在 Angular 5 中有简单的自定义服务：

@Injectable()
export class RequestsMethods {
  constructor(private http: HttpService) {
  }

}

我试图在@NgModule({}) 中将此注册为提供程序：

providers: [
    RequestsMethods,
    FormRegister,
    ErrorWatcher,
    {
      provide: HttpService,
      useFactory: httpFactoryService,
      deps: [Router, XHRBackend, RequestOptions]
    }
  ],

然后在我使用的组件中：

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.css'],
  providers: [RequestsMethods]

});

和组件构造函数：

constructor(private requestMethods: RequestsMethods){}

编译后给我一个错误：

错误：StaticInjectorError(AppModule)[HttpService -> XHRBackend]:
StaticInjectorError(Platform: core)[HttpService -> XHRBackend]: NullInjectorError: No provider for XHRBackend！在 NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js:1060) 在 resolveToken (core.js:1298) 在 tryResolveToken (core.js:1242) 在 StaticInjector .push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1139) at resolveToken (core.js:1298) at tryResolveToken (core.js:1242) at StaticInjector.push ../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1139) at resolveNgModuleDep (core.js:8374) at _callFactory (core.js:8442) at _createProviderInstance (core.js :8394)

如果从提供者中删除构造函数RequestsMethods并在提供者中注册RequestsMethods它工作正常

4

1 回答 1

1

1) 在您的 app.module.ts 中，

-- import and register RequestsMethods under providers.
-- import and register BrowserModule and HttpClientModule under imports.

@NgModule({
 imports: [
    BrowserModule,
    // import HttpClientModule after BrowserModule.
    HttpClientModule,
  ],
  providers: [RequestsMethods],
})

2) 将 RequestMethods 服务导入并注入到您想要的组件中。

构造函数（私有 requestMethods：RequestsMethods）{}

对于您的用例，不要在组件级别“提供”RequestMethods 服务。

IE：

在您的组件中，以下行就足够了

constructor(private requestMethods: RequestsMethods){}

providers: [RequestsMethods]在你的 @Component 注释中删除这个 ->

解释：

Provider 让依赖注入系统知道“如何获取依赖的值”。

当您将服务提供者添加到 app.module.ts（根模块）时，它在整个应用程序中都可用。

您应该始终尝试在根模块中提供所需的服务，除非您希望该服务仅在导入特定的 @NgModule 时可用。

于 2018-08-29T03:35:25.663 回答