Angular-7-如何从具有多个字段的Response中创建对象？

Question

How to map and use piple to create new object in Angular ? Below is the response I am getting from Service. I only want studentId, name and Title field.

{
  "studentList": [
    {
      "studentId": "e094208",
      "name": "John Doe",
      "Title": "Senior Engineering",
      "phoneNumbers": [
        {
          "number": "",
          "type": "BUSINESS",
          "public": false
        },
        {
          "number": "",
          "type": "MOBILE",
          "public": false
        }
      ],
      "emails": [
        {
          "email": "john.doe@gmail.com",
          "type": "BUSINESS",
          "public": false
        },
        .......
        .......
        .......
    }
}

Here is the my code. How to convert it into Student[] with three fields?

student = Student[];
this.studentService.searchStudent(name).subscribe((response: any) => {
    this.studentResponse = response.studentList;
});

Answer 1

Try something like this.

var studentListParsed = JSON.parse('<YOUR JSON>');

const data: Array<Student> = studentListParsed.studentList.map(student => {
return {
    studentId: student.studentId,
    name: student.name,
    title: student.title 
    }
});

Answer 2

You can pipe the data and map to the fields you want in the service. That is how I prefer to do it:

EDIT: Some change to the data structure as per your comment.

service:

import { map } from 'rxjs/operators';

// ....

searchStudent(name): Observable<Student[]> {
  // your function here to fetch data
  .pipe(
    map(data => {
      return data.peopleList.map(student => {
        return <Student>{ eId: student.emplNtId, name: student.name, jobTitle: student.busnTitle }
      })
    })
  )
}

Then in your component just assign the data to your variable:

this.studentService.searchStudent().subscribe((response: Student[]) => {
  this.studentResponse = response;
  console.log(this.studentResponse)
});

STACKBLITZ

PS: Also remember to type your data, avoid using any :)

Answer 3

You can use map function something like

this.studentService.searchStudent(name).subscribe((response: any) => {
    this.student= response.studentList.map(x =>{
return {studentId :x.studentId ,name : x.name ,title :x.Title } as Student;
});

});

Code Example

 var resp={ "studentList": [ { "studentId": "e094208", "name": "John Doe", "Title": "Senior Engineering", "phoneNumbers": [ { "number": "", "type": "BUSINESS", "public": false }, { "number": "", "type": "MOBILE", "public": false } ], "emails": [ { "email": "john.doe@gmail.com", "type": "BUSINESS", "public": false }] } ] } var data=resp.studentList.map(x =>{ return {studentId :x.studentId ,name : x.name ,title :x.Title } }); console.log(data)