Angular将json转换为对象数组

Posted 2023-03-13

【中文标题】Angular将json转换为对象数组

【英文标题】：Angular convert json to array of object

【发布时间】：2021-05-23 02:19:04

【问题描述】：

我正在从一个 REST Web 服务获取以下 JSON 数据。我想弄清楚如何转换为对象数组。

   "John": "Buttler"
   "Hugh": "Martin"
    .
    .
    .

我正在尝试转换为以下对象。基本上我期待Person []。在上面的 JSON 中，John、Hugh 是名字，而 Buttler、Martin 是姓氏。

export class Person
    firstName: string;
    lastName: string;

如果我得到如下 json，我可以进行转换

[

   "firstName": "John"
   "lastName:: "Buttler"
,

   "firstName": "Hugh"
   "lastName:: "Martin"

]

Angular 服务代码：

  findAllPersons(): Observable<Person[]> 
    return this.httpClient.get<Person[]>('url');
  

【参考方案1】：

import  HttpClient  from '@angular/common/http';
import  Injectable  from '@angular/core';
import  Observable  from 'rxjs';
import  map  from 'rxjs/operators';

interface NameData 
  [firstName: string]: string;


interface Person 
  firstName: string;
  lastName: string;


@Injectable()
class PersonService 
  constructor(private httpClient: HttpClient) 

  findAllPersons(): Observable<Person[]> 
    return this.httpClient.get<NameData>('url').pipe(
      map((v) =>
        Object.entries(v).map(([firstName, lastName]) => (
          firstName,
          lastName,
        ))
      )
    );
  

【参考方案2】：

您必须以所需的格式处理收到的响应。

      findAllPersons(): Observable<Person[]> 
        return this.httpClient.get<object>('url');
      
    
    
     findAllPersons().subscribe((response) =>
        let array = [];
        for(let key in response)
            let p = new Person();
            p.firstName = key;
            p.lastName = response[key];
            array.push(p);
         
        console.log(array); // your required array
     );