Angular 2 error NullInjectorError: No provider for Http

Question

I am trying to read a json github service and I am getting an error NullInjectorError: No provider for Http!

I already to add providers all over the code but it is not working I dont know what is causing the error but know where it is happening i need some who can help to understand what is causing this

import { Injectable } from '@angular/core';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule, Http, JsonpModule} from '@angular/http';
import { Observable} from 'rxjs'; 
import 'rxjs/add/operator/map';


@NgModule({

    imports: [     
          BrowserModule,
          HttpModule,
          JsonpModule,

        ]

  }) 

  @Injectable({
    providedIn:'root'
  })
 export class GithubService{
       constructor(private http:Http){

       }

       getUser(){
         const searchText ="js";
         const url = "http://api.github.com/search/users?q="+searchText;  
         this.http.get(url).subscribe(
           res=> {
             const data=res.json();
             console.log(data);
             return data;
           }
         )
       }
   }

Error I am getting:

AppComponent.html:7 ERROR NullInjectorError: StaticInjectorError(AppModule)[GithubService -> Http]: 
  StaticInjectorError(Platform: core)[GithubService -> Http]: 
    NullInjectorError: No provider for Http!

where did you import your `HttpModule`? – John Velasquez Jun 04 '19 at 07:06 — John Velasquez, Jun 04 '19 at 07:06

score 8 · Answer 1 · answered Jun 04 '19 at 04:39

Update: Angular v6+
From older versions (Angular v2 - v5): HttpModule is now deprecated and you need to replace it with HttpClientModule or else you will get the error too.

In your app.module.ts file change these

import { HttpClientModule} from "@angular/common/http";

Then update the modules imports[ ] array HttpClientModule

   @NgModule({
        imports: [
            BrowserModule,
            FormsModule, // if used
            HttpClientModule,
        ],
        declarations: [ AppComponent ],
        bootstrap:    [ AppComponent ]
    })

I cant simply update to A6 because the site is buildted on A2 — C-zar, Jun 04 '19 at 05:38

Parth Lukhi · Answer 2 · 2019-06-04T07:08:03.537

0

Please follow below 2 steps,

Go to app.moudle.ts

Add javascript import

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

Add @ngModule Angular import

imports: [
  BrowserModule,
  AppRoutingModule,
  HttpModule
],

edited Jun 04 '19 at 07:08

answered Jun 04 '19 at 04:51

Parth Lukhi

181
8

it did not work I am getting the same error after adding the imports – C-zar Jun 04 '19 at 05:11
Try importing your modules- HttpModule and others in app.module.ts – Parth Lukhi Jun 04 '19 at 07:08

Angular 2 error NullInjectorError: No provider for Http

2 Answers2