Angular2：angular2/http找不到

Question

我有一個服務試圖發出HTTP請求。

當我運行angular，我得到Angular2/http找不到。

Error: Error: XHR error (404 Not Found) loading http://localhost:3000/angular2/http (…)

service.ts

import {Injectable} from 'angular2/core'; 
import {Router} from 'angular2/router'; 
import { Http, Response,Headers,HTTP_PROVIDERS,RequestOptions,RequestMethod} from 'angular2/http'; 
import { Observable } from 'rxjs/Observable'; 
import {CommonService} from './common.service'; 

@Injectable() 
export class AuthenticationService { 

    public _productUrl = 'URL-HERE'; 

    constructor(
private _router: Router, 
private _http: Http, 
private _commonService: CommonService){} 

main.ts

import {bootstrap} from 'angular2/platform/browser' 
import {AppComponent} from './app.component' 
import {ROUTER_PROVIDERS} from 'angular2/router' 
import { HTTP_PROVIDERS } from 'angular2/http'; 

bootstrap(AppComponent, [ROUTER_PROVIDERS,HTTP_PROVIDERS]); 

app.component，TS

import {Http} from 'angular2/http'; 

的index.html

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script> 
<script src="node_modules/systemjs/dist/system.src.js"></script> 
<script src="node_modules/rxjs/bundles/Rx.js"></script> 
<script src="node_modules/angular2/bundles/angular2.dev.js"></script> 
<script src="node_modules/angular2/bundles/router.dev.js"></script> 
<script src="node_modules/angular2/bundles/http.dev.js"></script> 

缺少什麼我在這裏？

Answer 1

app.module.ts

import {HttpModule} from '@angular/http'; 
... 
@NgModule({ 
... 
imports: [ 
    HttpModule 
] 
}) 
... 

Answer 2

看看你的角度版本，如果低於beta.17你用 'angular2/HTTP'。通常它是'@ angular/http'。 嘗試查看最新的文檔。

你也可以通過查看你的node_modules文件夾來檢查這一點。 您可能有一張名爲@angular的地圖，而不是angular2地圖。

Answer 3

您輸入的方式不正確。你應該使用下列內容： -

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

Answer 4

您使用的是以下幾點：

import { Http, Response,Headers,HTTP_PROVIDERS,RequestOptions,RequestMethod} from 'angular2/http'; 

停止使用 「angular2/HTTP」，你應該導入使用的模塊 「@角/ HTTP」，因爲它會指向最新版本的角度，以防它發生變化（我們現在處於角度4）。使用此作爲一個例子爲未來：

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

Answer 5

你可以嘗試這：

import { Http } from '@angular/http'; 
and inject into the constructor(private http:Http){} 


app.module.ts 

import {HttpModule} from '@angular/http'; 
... 
@NgModule({ 
... 
imports: [ 
    HttpModule 
] 
}) 
... 

Answer 6

代替這種說法

import { Http, Response,Headers,HTTP_PROVIDERS,RequestOptions,RequestMethod} from 'angular2/http'; 
import { Observable } from 'rxjs/Observable'; 

通過下面的HTTP follwed import語句嘗試一次。

步驟1：import { HttpModule } from '@angular/http';

第二步：constructor(private http: Http ) {}

Answer 7

Angular CLI We are using.Follow this u can solve problem. Perfect Working for me. 

    app.module.ts 
    ------------- 
    import { BrowserModule } from '@angular/platform-browser'; 
    import { NgModule } from '@angular/core'; 
    import { HttpModule } from '@angular/http' 
    import { AppComponent } from './app.component'; 

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

    sample.service.ts 
    ----------------- 

    import { Injectable } from '@angular/core'; 
    import { Http, Headers } from '@angular/http'; 
    import { Observable } from 'rxjs/Rx'; 
    import 'rxjs/add/operator/map'; 

    @Injectable() 
    export class SampleService { 
     public serviceUrl="someURL"; 
     constructor(private http:Http) { 

     } 
     doSomeService(bean:any) { 
      let headers = new Headers({'Content-Type': 'application/json'});   
      return this.http.post(
       serviceUrl, 
       JSON.stringify(bean), 
       {headers: headers} 
      ).map(res => res.json()) 
     } 
    } 
Try this! Working. Thank you.