沒有Http的提供者

Question

我有將問題注入Angular 2應用程序的問題。 幾天前它工作正常，但現在我有錯誤：

原始例外：沒有Http的提供商！

有主要的

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
import { LoginModule } from "./login/login.module";
import { Http } from "@angular/http";


platformBrowserDynamic().bootstrapModule(LoginModule);

登錄module.ts

@NgModule({
    imports: [BrowserModule, FormsModule], // external modules for all components
    declarations: [LoginComponent], // component which belong to this module
    bootstrap: [LoginComponent] // component on load
})
export class LoginModule {
}

最后在LoginModule中登錄LoginComponent

import { Component } from '@angular/core';
import { AccountService } from "../data/account.service";
import { Http, Response, RequestOptions, Headers } from '@angular/http';
import { LocalStorage } from '../storage/storage';

@Component({
    selector: 'tp-login',
    templateUrl: `app/login/login.html`,
    styleUrls: ['app/login/login.css'],
    providers: [AccountService, LocalStorage]

})

LoginComponent中沒有關於沒有HttpProvider的異常。 Somone知道如何解決這個問題？

Answer 1

很好地將所有模塊依賴項封裝到@ngModule屬性中的主類模塊中

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';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})

因此，您可以確定當您的模塊將作為子依賴項包含時 - 所有依賴項將在之前解決。

Answer 2

在應用程序模塊中。

從@angular/http導入HttpModule和Http ：

import {HttpModule, RequestOptions, XHRBackend, Http} from "@angular/http";

在@NgModule聲明中添加HttpModule以導入屬性：

imports: [
    HttpModule,
]

在@NgModule Providers屬性中提供Http

providers: [
    {provide: Http, useFactory: (backend: XHRBackend, defaultOptions: RequestOptions) => new Http(backend, defaultOptions),rations
        deps: [XHRBackend, RequestOptions]}
],

Answer 3

首先，從“./login/login.module”中刪除import {LoginModule}; 在你的main.ts中，它不能解決你的問題。

嘗試將HttpModule導入Login模塊文件或根模塊：

 import { HttpModule } from '@angular/http'; @NgModule({ imports: [HttpModule, BrowserModule, FormsModule], declarations: [LoginComponent], // component which belong to this module bootstrap: [LoginComponent] // component on load }) export class LoginModule { } 

Answer 4

在component/服務文件中添加HttpModule ：

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

然后在app.module.ts添加它HttpModule ：

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

並在ngModules導入

imports: [
    BrowserModule,
    HttpModule   ]