如何在listview angular2 nativescript中解析这个json结构

Luf*_*ffy 1 typescript nativescript angular2-services angular2-nativescript angular

json结构:

{
  "Employee": [
       {"id":1,"name":"Dan" },
       {"id":2,"name":"Stack" },
       .....
    ]
}
Run Code Online (Sandbox Code Playgroud)

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")

      );      

  }
Run Code Online (Sandbox Code Playgroud)

编辑:

零件:

  <label text ="{{getData }}" ></label>



  getObjectData() {

    return this._http.get('/page/emp.json')
      .map((response :Response) => response.json());

  }  
Run Code Online (Sandbox Code Playgroud)

之后,我不知道如何解析json并在listview中为此结构打印它.我提到了一些视频和杂货申请.但我仍然无法得到结果.我非常困惑arrayname员工.

我需要name在listview中只打印from响应.

Fal*_*aly 6

这应该工作:

<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);
}  
Run Code Online (Sandbox Code Playgroud)

根据http调用返回的对象,可能不需要.data:

getObjectData() {
    return this._http.get('/page/emp.json')
        .map((response :Response) => response.json());
}
Run Code Online (Sandbox Code Playgroud)