EXCEPCIÓN angular: no hay proveedor para Http

Resuelto daniel asked hace 9 años • 16 respuestas

Obtengo el EXCEPTION: No provider for Http!en mi aplicación Angular. ¿Qué estoy haciendo mal?

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'
                })
            });
daniel avatar Nov 15 '15 22:11 daniel
Aceptado

Importar el módulo Http

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

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

platformBrowserDynamic().bootstrapModule(AppModule);

Lo ideal es dividir este código en dos archivos separados. Para más información lea:

  • https://v2.angular.io/docs/ts/latest/cookbook/rc4-to-rc5.html
  • https://v2.angular.io/docs/ts/latest/guide/ngmodule.html
Philip avatar Jan 03 '2016 14:01 Philip

>= Angular 4.3

para los introducidosHttpClientModule

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

Importe HttpModuleal módulo donde lo use (aquí, por ejemplo AppModule,:

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

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

Importar HttpModulees bastante similar a agregar HTTP_PROVIDERSen la versión anterior.

Günter Zöchbauer avatar Aug 30 '2016 09:08 Günter Zöchbauer

Con la versión Angular 2.0.0 del 14 de septiembre de 2016, todavía estás usando HttpModule. Su principal app.module.tsse vería así:

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

@NgModule({
   bootstrap: [ AppComponent ],
   declarations: [ AppComponent ],
   imports: [
      BrowserModule,
      HttpModule,
      // ...more modules...
   ],
   providers: [
      // ...providers...
   ]
})
export class AppModule {}

Luego, en tu app.tspuedes arrancar como tal:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/main/app.module';

platformBrowserDynamic().bootstrapModule(AppModule);
Caleb avatar Sep 17 '2016 22:09 Caleb