我是Ionic和Angular的新手。基本上,我需要根据我自己的服务器的JSON响应动态创建选项卡。
我的JSON回复
{
"category_id": 1,
"parent_id": 0,
"name": "Root Catalog",
"position": 0,
"level": 0,
"children": [
{
"category_id": 2,
"parent_id": 1,
"name": "Default Category",
"is_active": 1,
"position": 1,
"level": 1,
"children": [
{
"category_id": 5,
"parent_id": 2,
"name": "Masala Mix",
"is_active": 1,
"position": 1,
"level": 2,
"children": []
},
{
"category_id": 3,
"parent_id": 2,
"name": "Pure spices",
"is_active": 1,
"position": 2,
"level": 2,
"children": []
},
{
"category_id": 6,
"parent_id": 2,
"name": "Pickles",
"is_active": 1,
"position": 3,
"level": 2,
"children": []
},
]}]}
我的输出应该是创建3个标签,名称为" Masala Mix"," Pure Spices"和#34;泡菜"。但我现在得到的只是一个名称为"默认类别"
的标签创建<ion-tabs >
<ion-tab [root]="tab3Root" tabTitle="Contact" tabIcon="contacts"></ion-tab>
<ion-tab *ngFor="let rew of people" [root]="rew.root" [tabTitle]="rew.name">
</ion-tab>
<ion-tab *ngFor="let cat of rew?.children" [tabTitle]="cat.name"></ion-tab>
</ion-tabs>
TypeScript文件
loadPeople() {
this.peopleSearch.load()
.then(data1 => {
this.people = data1.children;
console.log("Tabs : "+this.people);
}
);
}
浏览器控制台输出:标签:[object Object]
HTTP提供商
export class PeopleSearch {
data1: any;
constructor(public http: Http) {
console.log('Hello PeopleSearch Provider');
}
load() {
if (this.data1) {
return Promise.resolve(this.data1);
}
// Dont have the data yet
return new Promise(resolve => {
this.http.get('http://happyos.in/cat.php')
.map(res => res.json())
.subscribe(data => {
this.data1 = data;
resolve(this.data1);
});
});
}
}