angular 2 rc - 未定義のプロパティ 'request'を読み取ることができません

Question

これは私のコードであり、私の問題の解決策を見つけたり見つけることができませんでした。答えがどこかに存在し、それが見つからない場合は申し訳ありません。

これはapp.component.tsは

import {Component} from '@angular/core'; 
 
import { HTTP_PROVIDERS} from '@angular/http'; 
 
import {SimpleHTTPComponent} from './simplehttp' 
 

 

 
@Component({ 
 
    selector: 'my-app', 
 
    providers: [HTTP_PROVIDERS], 
 
    template: ` 
 
    <div> 
 
     <simple-http></simple-http> 
 
    </div> 
 
    `, 
 
    directives: [SimpleHTTPComponent] 
 
}) 
 
export class AppComponent { 
 
\t 
 
\t data: Object; 
 
\t loading: boolean; 
 
\t constructor() { 
 
    \t } 
 
}

ファイルこれは私のsimplehttp.tsが

import {Component} from '@angular/core'; 
 
import {Http, Response} from '@angular/http'; 
 
import { HTTP_PROVIDERS } from '@angular/http'; 
 
import {Inject} from '@angular/core' 
 

 

 
@Component({ 
 
selector: 'simple-http', 
 
template: ` 
 
\t <h2>Basic Request</h2> 
 
\t <button type="button" (click)="makeRequest()">Make Request</button> 
 
\t <div *ngIf="loading">loading...</div> 
 
\t <pre>{{data | json}}</pre>`, 
 
providers:[HTTP_PROVIDERS] 
 
}) 
 
export class SimpleHTTPComponent { 
 
\t data: Object; 
 
\t loading: boolean; 
 
\t http: Http; 
 
\t constructor(@Inject(Http) private _http: Http){ 
 
\t \t 
 
\t } 
 
\t makeRequest():void{ 
 
\t \t this.loading = true; 
 
\t \t this.http.request('http://jsonplaceholder.typicode.com/posts/1') 
 
\t \t .subscribe((res: Response) => { 
 
\t \t this.data = res.json(); 
 
\t \t this.loading = false; 
 
\t \t }); 
 
\t } 
 

 
}

Answer 1

ファイルであります

3人が必要ありませんHTTP_PROVIDERS複数回

コードにはバグがあります。あなたは、コンストラクタのパラメータは、これはまた、自動的にインスタンスプロパティを宣言しprivateかpublicアクセス修飾子を持っている場合はそれが

export class SimpleHTTPComponent { 
    data: Object; 
    loading: boolean; 

    constructor(@Inject(Http) private _http: Http){ 

    } 
    makeRequest():void{ 
     this.loading = true; 
     this._http.request('http://jsonplaceholder.typicode.com/posts/1') 
     .subscribe((res: Response) => { 
     this.data = res.json(); 
     this.loading = false; 
     }); 
    } 
} 

ようにする必要があり_httpに注入したがhttp

export class SimpleHTTPComponent { 
    data: Object; 
    loading: boolean; 
    http: Http; 

    // injects to local variable `_http` 
    constructor(@Inject(Http) private _http: Http){} 

    makeRequest():void{ 
     this.loading = true; 
     // uses local variable `http` (without `_`) 
     this.http.request('http://jsonplaceholder.typicode.com/posts/1') 
     .subscribe((res: Response) => { 
     this.data = res.json(); 
     this.loading = false; 
     }); 
    } 
} 

を使用しています。