JSON到Angular中的类对象

Question

我有一个具有默认值的模型类

export class Person {
    _index : string ="hello";
    _type : string;
    _id : string;
    _score : number;
    _source : Source = new Source();
}
export class Source {
    name : string;
    age : number = 0;
    salary : number;
    details : Details = new Details();
}

export class Details{
    year : number = 1997;
    education : Education = new Education;
}


export class Education{
    score:number = 98;
}

当我创建实例per : Person = new Person (); 时，这会构建一个对象。

{
"_index":"hello",
"_source":{
"age":0,
"details":{
"year":1997,
"education":{
"score":98
}
}
}

现在我已经从模型中的服务器获得了 JSON 模型

}
"_index":"person",
"_type":"single",
"_id":"AWCoCbZwiyu3OzMFZ_P9",
"_version":2,
"found":true,
"_source":{
"name":"sauravss",
"age":"21",
"salary":"50000"
}
}

我想将值填充到我的类对象，但是当我用结果订阅我的类对象时，它会将我的类对象更改为 JSON 对象的形式并消除默认值，从而为我提供从服务器接收到的模型上面的 JSON。订阅后，我会在per 收到此表格。

我想要的是 JSON 对象必须用它匹配的字段填充类 Object 并且不匹配的字段必须包含默认值。

editPerson():void {
    const id : string = this.route.snapshot.paramMap.get('id');
    console.log(id);
    this.personService.getPerson(id).subscribe(person => {
      this.per = person;
    });
  }

  getPerson (id : string): Observable<Person> {
    const url = `${this.url}/${id}`;
    console.log(id);
    return this.http.get<Person>(url);
  }

Answer 1

您需要明确地将您的 Json 对象转换为您需要的类。

你可以在构造函数中这样做：

export class Person() {
    // ...
    constructor(jsonString: string) {
        const jsonData = JSON.parse(jsonString);
        // do your assignment from jsonData
    }
}

Answer 2

这是目前的解决方法。这将有助于刚接触 Angular 的人。如果有更好的解决方案请[评论]。

export class Person {
    _index : string;
    _type : string;
    _id : string;
    _source : Source = new Source();

    constructor (res : Person){
        this._id = res._id;
        this._index = res._index;
        this._type = res._type;
        if(res._source){
            this._source.name = res._source.name;
            this._source.age = res._source.age;
            this._source.salary = res._source.salary;
            if(res._source.details){
                this._source.details.year = res._source.details.year;
                if(res._source.details.education){
                    this._source.details.education = res._source.details.education;
                }
            }
        }
    }
}
export class Source {
    name : string = '';
    age : number = 0;
    salary : number = 0;
    details : Details = new Details();
}

export class Details{
    year : number = 1997;
    education : Education = new Education;
}


export class Education{
    score:number = 98;
}