ウェブサイトの起動時にAngular 2サービスを使用してサーバーから大きなオブジェクトを引き出しています。角度2のHTTPサービスインジェクション可能
{
Edu: [...],
Exp: [...],
Links: [...],
Portfolio: [...],
Skills: [...]
}
そして、私はサービスをこのように設定します:
AllDataService:
import { Injectable, OnInit } from "@angular/core";
import { Http, Response } from "@angular/http";
import { Observable } from "rxjs/Rx";
@Injectable()
export class AllDataService {
private allDataUrl = ".../allData";
private loading: boolean;
private Edu: Array<any>;
private Exp: Array<any>;
private Links: Array<any>;
private Portfolio: Array<any>;
private Skills: Array<any>;
constructor(private http: Http) {
this.loading = true;
this.Edu = [];
this.Exp = [];
this.Links = [];
this.Portfolio = [];
this.Skills = [];
}
ngOnInit() {
this.getAllData();
}
// Get data from api, aka "Set" methods
getAllData() {
return this.http.get(this.allDataUrl)
.subscribe(
data => {
this.Edu = data.Edu;
this.Exp = data.Exp;
this.Links = data.Links;
this.Portfolio = data.Portfolio;
this.Skills = data.Skills;
this.loading = false;
},
err => console.error(err)
);
}
// “Get” methods
getLoading() { return this.loading; }
getEdu() { return this.Edu; }
getExp() { return this.Exp; }
getLinks() { return this.Links; }
getPortfolio() { return this.Portfolio; }
getSkills() { return this.Skills; }
}
そして、私のコンポーネントで、私はそのようにサービスを注入し、私はこのようなルックスを引くために必要なデータ
HomeIcons:
import { Component } from "@angular/core";
import { AllDataService } from "../allDataService";
@Component({
selector: "home-icons",
template: `
<div class="home-icons-wrapper">
<ul class="home-icons-ul no-select">
<li class="home-icons-li"
*ngFor="let link of links" >
<a href={{link.url}} target="_blank">
<span class="home-icons-icon {{link.icon}}"></span>
</a>
</li>
</ul>
</div>
`,
providers: [AllDataService]
})
export class HomeIcons {
public links;
constructor(private http: Http, private allDataService: AllDataService) {
this.links = allDataService.getLinks();
}
}
私がデータを取得することができます210
しかし、AllDataServiceでは、プロパティ(Exp、Edu、Skills ...)がResponseに存在しないというエラーメッセージが表示されます。私が開始時に必要なデータを取得し、すべてのコンポーネントがデータを取得できるように、httpサービスを正しく設定するにはどうすればよいですか?おかげ
あなたのJSONデータを投稿してくださいでした?そして 'ToJson'メソッドを実装しましたか? –
ToJsonメソッドのコードを表示できますか?エラーはコンパイル時ですか? –
ToJson()を組み込むのは悪いことでしたが、これは単なる試しに無視して、私はすでにコードから取り除いていました。 – thousight