Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular EXCEPTION: No provider for Http

Tags:

angular

I am getting the EXCEPTION: No provider for Http! in my Angular app. What am I doing wrong?

import {Http, Headers} from 'angular2/http'; import {Injectable} from 'angular2/core'   @Component({     selector: 'greetings-ac-app2',     providers: [],     templateUrl: 'app/greetings-ac2.html',     directives: [NgFor, NgModel, NgIf, FORM_DIRECTIVES],     pipes: [] }) export class GreetingsAcApp2 {     private str:any;      constructor(http: Http) {          this.str = {str:'test'};          http.post('http://localhost:18937/account/registeruiduser/',             JSON.stringify(this.str),             {                 headers: new Headers({                     'Content-Type': 'application/json'                 })             }); 
like image 826
daniel Avatar asked Nov 15 '15 15:11

daniel


2 Answers

Import the HttpModule

import { HttpModule } from '@angular/http';  @NgModule({     imports: [ BrowserModule, HttpModule ],     providers: [],     declarations: [ AppComponent ],     bootstrap: [ AppComponent ] }) export default class AppModule { }  platformBrowserDynamic().bootstrapModule(AppModule); 

Ideally, you split up this code in two separate files. For further information read:

  • https://v2.angular.io/docs/ts/latest/cookbook/rc4-to-rc5.html
  • https://v2.angular.io/docs/ts/latest/guide/ngmodule.html
like image 98
Philip Avatar answered Oct 12 '22 23:10

Philip


>= Angular 4.3

for the introduced HttpClientModule

import { HttpClientModule } from '@angular/common/http';  @NgModule({   imports: [     BrowserModule,     FormsModule, // if used     HttpClientModule,     JsonpModule // if used   ],   declarations: [ AppComponent ],   bootstrap:    [ AppComponent ] }) export class AppModule { } 

Angular2 >= RC.5

Import HttpModule to the module where you use it (here for example the AppModule:

import { HttpModule } from '@angular/http';  @NgModule({   imports: [     BrowserModule,     FormsModule, // if used     HttpModule,     JsonpModule // if used   ],   declarations: [ AppComponent ],   bootstrap:    [ AppComponent ] }) export class AppModule { } 

Importing the HttpModule is quite similar to adding HTTP_PROVIDERS in previous version.

like image 29
Günter Zöchbauer Avatar answered Oct 13 '22 01:10

Günter Zöchbauer