How to return specific fields from a JSON object array in angular http service as response

Issue

My Interface is like this:

export interface User {
    id: number;
    name: string;
}

Response i received from api is:

[
  {
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    "email": "Sincere@april.biz"
  },
  {
    "id": 2,
    "name": "Ervin Howell",
    "username": "Antonette",
    "email": "Shanna@melissa.tv"
  }
] 

I wish to extract only id and name fields and return as response

[
  {
    "id": 1,
    "name": "Leanne Graham"
  },
  {
    "id": 2,
    "name": "Ervin Howell"
  }
] 

getdata(): Observable<User[]>{
   return this.http.get<User[]>('https://jsonplaceholder.typicode.com/users').pipe(
     map((data: User[])=> {
       //how to extract id and name here
     })
   )
} 

I need to return only id and name fields from the whole api response. How can i achieve that using map or any other techniques inside service, Please guide me

Solution

Finally solved it, using another map on the response object to get each records

customlist(): Observable<User[]>{
 return this.http.get<any>(`${this.url}/api/list`).pipe(
       map((obj:any) => {
          let result = obj.map((data: User) => {
            return ({'id': data.id, 'name': data.name})
          })
          return result;
       })
    )
}

If anybody has better solution, please mention. Thanks

Answered By - Samit Sinha