AppComponent.html:1 ERROR Error: No provider for Http! at injectionError (core.es5.js:1169)

AppComponent.html:1 ERROR Error: No provider for Http! at injectionError (core.es5.js:1169)

查看控制台日志时,我收到此错误“没有 Http 提供程序! 在我的 Angular 4 应用程序中尝试使用 Http 模块时出现 injectionError'。我的 app.module.ts 文件是

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';
import { UserComponent } from './components/user/user.component';

import { DataService } from './services/data.service';

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

我的服务文件'data.service.ts'是

import { Injectable } from '@angular/core';
import { Http } from '@angular/Http';
import 'rxjs/add/operator/map';

@Injectable()
export class DataService {

constructor(public http: Http) {
console.log('Data service connected...');
}

getPosts() {
return this.http.get('https//jsonplaceholder.typicode.com/posts')
.map(res => res.json());
}

}

如图所示,我已将 HttpModule 包含在 app.module.ts 文件中。我还缺少什么?

看来您在 data.service.ts 的导入 Http 语句 from 路径中有错字,

而不是

import { Http } from '@angular/Http';

应该是

import { Http } from '@angular/http';