angular2 http：post throwing error

我正在研究angular2中的一個簡單的CRUD應用程序，並且在發佈到後端服務器時遇到問題。我的代碼類如下angular2 http：post throwing error

export class PersonForm { 
    data:Object; 
    loading: boolean; 
    personForm: ControlGroup; 
    http:Http; 
    constructor(personFormBuilder: FormBuilder) { 
    this.personForm = personFormBuilder.group({ 
     'name': [], 
     'age': [] 
    }); 
    } 

    onSubmit(value:any) : void { 
    console.log('you submitted these values: ', value); 
    this.http.post("http://localhost:3000/people/create",JSON.stringify(value)) 
     .subscribe((res: Response) => { 
     this.data = res.json(); 
     this.loading = true; 
    }); 

} 

}

上面的代碼在我的控制檯中導致下面的錯誤。我不知道，因爲我每次如下例如我究竟發現了什麼是不確定的：

EXCEPTION: Error during evaluation of "ngSubmit" 
ORIGINAL EXCEPTION: TypeError: undefined is not an object 
(evaluating 'this.http.post')

這裏是我的進口，以防萬一我失去了一個組件

import {Component } from 'angular2/core'; 
import {bootstrap} from 'angular2/platform/browser'; 
import {CORE_DIRECTIVES,FORM_DIRECTIVES, FormBuilder} from 'angular2/common'; 
import {HTTP_PROVIDERS, Http, Response, Headers} from 'angular2/http'; 
import {ControlGroup} from "angular2/common";

來源

2016-01-29 ctilley79

你必須在構造函數中注入Http。 –

'Http'應該被導入那裏＆你的類的構造函數應該從它定義一個新的對象..否則它應該在你的父組件中至少有 –

您需要注入http對象在組件的構造函數：

import {Http} from 'angular2/http'; 

@Component({ 
    (...) 
}) 
export class PersonForm { 
    data:Object; 
    loading: boolean; 
    personForm: ControlGroup; 
    http:Http; 

    constructor(private http: Http, personFormBuilder: FormBuilder) { 
    (...) 
    } 
}

希望它可以幫助你，蒂埃裏

來源

2016-01-29 19:57:48

不可能是OP在父組件中注入'Http'依賴項？ –

@Pankaj我不能在問題中看到父組件;-)我猜'PersonForm'是一個組件。一個'Http'對象應該通過注入來提供，而不是作爲一個組件的參數... –

有意義，只是有一個想法:) +1 –

angular2 http：post throwing error

回答

相關問題