如何在listview angular2 nativescript中解析这个json结构
How to parse this json structure in listview angular2 nativescript
json 结构:
{
"Employee": [
{"id":1,"name":"Dan" },
{"id":2,"name":"Stack" },
.....
]
}
app.component.ts:
ngOnInit() {
console.log("first", "Test");
this.globalReader.getObjectData()
.subscribe(data => this.getData = JSON.stringify(data), ---> Response printed successfully here.I'm able to print it in label.
error => alert(error),
() => console.log("finished")
);
}
编辑:
分量:
<label text ="{{getData }}" ></label>
getObjectData() {
return this._http.get('/page/emp.json')
.map((response :Response) => response.json());
}
在那之后我不知道如何解析 json 并在列表视图中为这个结构打印它。我提到了一些视频和杂货应用程序。但是我无法得到结果 still.I 我对 arrayname Employee 非常困惑。
我只需要从列表视图中的响应打印 name
。
您需要映射数据而不是 Strigify 数据
this.globalReader.getObjectData()
.subscribe(data => this.getData = data.employee.map(e => e.name))
您可以像下面这样获取它:
<ListView [items]="getData">
<template let-item="item">
<StackLayout>
<Label [text]='"ID: " + item.id'></Label>
<Label [text]='"Name: " + item.name'></Label>
</StackLayout>
</template>
</ListView>
这应该有效:
<ListView [items]="employees" row="1">
<template let-item="item">
<Label [text]="item.name"></Label>
</template>
</ListView>
// Create Employee Class:
export class Employee {
constructor(public id: string, public name: string) {}
}
// Your component:
this.employees: Array<Employee> = [];
ngOnInit() {
this.globalReader.getObjectData()
.subscribe(data => {
this.employees = data.Employee.map(item => new Employee(item.id, item.name);
});
});
}
// The getObjectData method of *globalReader* service:
getObjectData() {
return this._http.get('/page/emp.json')
.map((response :Response) => response.json().data);
}
根据 http 调用返回的对象,可能不需要 .data:
getObjectData() {
return this._http.get('/page/emp.json')
.map((response :Response) => response.json());
}
json 结构:
{
"Employee": [
{"id":1,"name":"Dan" },
{"id":2,"name":"Stack" },
.....
]
}
app.component.ts:
ngOnInit() {
console.log("first", "Test");
this.globalReader.getObjectData()
.subscribe(data => this.getData = JSON.stringify(data), ---> Response printed successfully here.I'm able to print it in label.
error => alert(error),
() => console.log("finished")
);
}
编辑:
分量:
<label text ="{{getData }}" ></label>
getObjectData() {
return this._http.get('/page/emp.json')
.map((response :Response) => response.json());
}
在那之后我不知道如何解析 json 并在列表视图中为这个结构打印它。我提到了一些视频和杂货应用程序。但是我无法得到结果 still.I 我对 arrayname Employee 非常困惑。
我只需要从列表视图中的响应打印 name
。
您需要映射数据而不是 Strigify 数据
this.globalReader.getObjectData()
.subscribe(data => this.getData = data.employee.map(e => e.name))
您可以像下面这样获取它:
<ListView [items]="getData">
<template let-item="item">
<StackLayout>
<Label [text]='"ID: " + item.id'></Label>
<Label [text]='"Name: " + item.name'></Label>
</StackLayout>
</template>
</ListView>
这应该有效:
<ListView [items]="employees" row="1">
<template let-item="item">
<Label [text]="item.name"></Label>
</template>
</ListView>
// Create Employee Class:
export class Employee {
constructor(public id: string, public name: string) {}
}
// Your component:
this.employees: Array<Employee> = [];
ngOnInit() {
this.globalReader.getObjectData()
.subscribe(data => {
this.employees = data.Employee.map(item => new Employee(item.id, item.name);
});
});
}
// The getObjectData method of *globalReader* service:
getObjectData() {
return this._http.get('/page/emp.json')
.map((response :Response) => response.json().data);
}
根据 http 调用返回的对象,可能不需要 .data:
getObjectData() {
return this._http.get('/page/emp.json')
.map((response :Response) => response.json());
}