HTTP用のプロバイダはありません

Question

私はAngular 2アプリケーションにHTTPを注入することに問題があります。数日前には罰金働いていたが、今、私はエラーがあります：

ORIGINAL EXCEPTION: No provider for Http!

をmain.tsのLoginModule

にLoginComponent

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 { 
} 

そして最後にはあります

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

まず、インポート{LoginModule}を "./login/login.module"から削除します。あなたのmain.tsでは、それはあなたの問題を解決しません。

HttpModuleをログインモジュールファイルにしたり、ルートモジュール内のインポートを試してみてください。

グッド

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 2

@ngModule属性

内のメインクラスモジュールに、すべてのモジュールの依存関係をincapsulateします

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 3

Appモジュール内。

インポートHttpModuleをのHttp角度/ HTTP

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

@から

imports: [ 
    HttpModule, 
] 

が@NgModule

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

Answer 4

のプロバイダプロパティでHTTPを提供@NgModule装飾でプロパティをインポートするHttpModuleを追加

component/サービスファイルにHttpModuleを追加してくださいE：それではあなたは `appRoutes`を定義しない方法

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

とngModulesの輸入でも

imports: [ 
    BrowserModule, 
    HttpModule ]