Angular 2 访问 REST API 错误 - 没有 Http 提供程序答案

【问题标题】：Angular 2 accessing REST API error -No provider for HttpAngular 2 访问 REST API 错误 - 没有 Http 提供程序
【发布时间】：2018-06-18 02:32:45
【问题描述】：

我正在开发一个 Angular 2 应用程序来访问 REST API 端点并向用户显示数据。我在 Postman 中测试了 REST API 端点，它们运行良好。当我从 Angular 访问 GET 端点时，出现以下错误 sn-p。

Error: StaticInjectorError[Http]: 
StaticInjectorError[Http]: 
NullInjectorError: No provider for Http!
at _NullInjector.get (webpack-internal:///../../../core/esm5/core.js:1189)
at resolveToken (webpack-internal:///../../../core/esm5/core.js:1477)
at tryResolveToken (webpack-internal:///../../../core/esm5/core.js:1419)
at StaticInjector.get (webpack-internal:///../../../core/esm5/core.js:1290)
at resolveToken (webpack-internal:///../../../core/esm5/core.js:1477)
at tryResolveToken (webpack-internal:///../../../core/esm5/core.js:1419)
at StaticInjector.get (webpack-internal:///../../../core/esm5/core.js:1290)
at resolveNgModuleDep (webpack-internal:///../../../core/esm5/core.js:11074)
at NgModuleRef_.get (webpack-internal:///../../../core/esm5/core.js:12306)
at resolveDep (webpack-internal:///../../../core/esm5/core.js:12804)

尝试同时导入 Http 和 HttpModule，就像代码的顶部一样。

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

以下是我获取数据功能的相关代码sn-p。

getData(){
    const url = 'http://localhost/laravel_app/public/api/getdata';
    this.http.get(url).subscribe(
      res => {
        const data = res.json();
        console.log(data);
        return data;
      }
    );
  }

【问题讨论】：

你需要注入HTTP服务

标签： javascript angular

【解决方案1】：

如果您使用的是 Angular v5 版本，请在您的 app.module.ts 中的 HttpModule 之后导入 HttpClientModule。

imports: [
    HttpModule,
    HttpClientModule
]

【讨论】：

使用 Angular 2 版本而不是 v5
什么是版本
Angular 版本是 2
发布您的 app.module.ts

【解决方案2】：

你可以导入这一行 app.module.ts

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

并写入

@NgModule({
   imports: [
    HttpModule,
   ]
 })

【讨论】：

这样做了。然后我收到此错误 - 未捕获的错误：模块“AppModule”导入的意外值“Http”。请添加@NgModule 注释。
终于成功了。我已经导入了 Http 和 HttpModule。正如您所提到的，无需同时导入。

【解决方案3】：

您应该在 module.ts 文件中导入 HttpModule，并在您实际使用它进行 api 调用的服务中导入 Http。

看看here

【讨论】：

没有module.ts文件。
我的意思是无论您在哪里定义 Angular 2 模块。可能是 app.module.ts

【解决方案4】：

您需要将此代码添加到您的 app.module.ts 文件中。

import { NgModule, ErrorHandler } from '@angular/core';
import { HttpModule } from '@angular/http';

imports: [
   BrowserModule,
   HttpModule       
]

实际上 http 用于 Angular 2，但现在在最新版本的 Angular 中使用 HttpClient。

【讨论】：