Angular 2-英雄ガイドチュートリアルhttpリクエスト
5322 ワード
これを見る前に、あなたのチュートリアルが間違っていないことを確認して、走ることができます.最近多くの人がhttpリクエストの問題に遭遇しています.バックグラウンドインタフェースとのドッキング方法がわかりません.まず、私たちの英雄ガイドのチュートリアルでは、シミュレーションの偽データがあります.私たちは彼をインポートする必要はありません.appでは.module.tsでは、インポートしたangular-in-memory-web-apiを注釈したり削除したりする必要があります.また、以下の@NgModuleのimports:で次のコードを見つけて削除すればいいです.InMemoryWebApiModule.forRoot(InMemoryDataService)、そしてhero.service.tsでは以下のように変更されます.
hero-detail.component.htmlにテストボタンを追加し、
hero-detail.component.tsにはクリックイベントテストが書かれています.
ここで注意しなければならないのはhero-detailです.component.tsには以下のように導入される.
にある
constructorにはprivate http:Httpと書く必要があります.これでOKです.
また、関数テスト呼び出し==:
@Injectable()
export class HeroService {
private heroesUrl = 'http://10.1.1.80:8080/test1'; ( , 。)
}
あなたのヒーローリストはバックグラウンドから取得されました.その後、私たちもhero-detail.component.htmlにテストボタンを追加し、
hero-detail.component.tsにはクリックイベントテストが書かれています.
<button (click)="test()">testbutton>
test(): void{
this.http.get('http://10.1.1.80:8080/test1')
.toPromise().then((response) => {
console.log(response.json());
});
}
ここで注意しなければならないのはhero-detailです.component.tsには以下のように導入される.
import { Http ,Response} from '@angular/http';
import 'rxjs/add/operator/toPromise';
にある
constructorにはprivate http:Httpと書く必要があります.これでOKです.
また、関数テスト呼び出し==:
test2():void{
alert("test3");
}
kf():void{
alert("777");
this.test2();
}
test(): void{
this.http.get('http://10.1.1.80:8080/test1')
this.kf();
}