Angular4项目构造函数初始化变量报错：DataService无提供者

这个错误提示NullInjectorError: No provider for DataService!其实很明确——Angular的依赖注入系统找不到你要注入的DataService的提供者，简单说就是你没告诉Angular该怎么创建这个服务的实例。下面给你两种适用于Angular 4的解决办法：

方法1：在AppModule的providers数组中注册服务 #

Angular 4还没有providedIn这个语法，所以最直接的方式是在根模块（app.module.ts）里把DataService添加到providers数组中：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { DataService } from './data.service'; // 别忘了先导入服务

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [DataService], // 这里把服务加入提供者列表
  bootstrap: [AppComponent]
})
export class AppModule { }

这样Angular在启动时就会知道要为DataService创建一个单例实例，并且可以在任何组件中注入它。

方法2：如果你的服务是特性模块内的，也可以在对应模块注册 #

如果DataService是属于某个特性模块的，那你也可以在该特性模块的providers数组里注册它，这样这个模块下的组件都能使用这个服务实例。不过如果是全局要用的服务，还是建议在根模块注册。

为什么会出现这个错误？ #

Angular的依赖注入遵循"谁注册谁提供"的原则，当你在组件的构造函数中注入DataService时，Angular会去查找已经注册的服务提供者，如果找不到就会抛出这个错误。所以只要把服务正确注册到提供者列表里，问题就能解决。

内容的提问来源于stack exchange，提问作者Moulali