Question

我正在使用HttpClient从API获取Json并使用该HttpClient的autoMapping将json映射到目标对象，如下所示：

this.httpClient.post<Person>(url, body, { headers: headers, params: httpParams }).retry(ConfigurationService.apiHttpRetries)

我的问题是我的Person类包含如下的getter：

get FullName() { return `${this.firstName} + ' ' ${this.lastName}`; }

在httpClient.Post之后，我得到的Person对象只包含从json而不是其他属性返回的字段，而没有我的FullName getter。

我尝试使用Object.Assign，但它也无效......

如果httpClient.post泛型方法没有执行map并只执行返回JSON.parse（jsonResult）之类的操作，那么它有什么大不了的呢？

Answer 1

泛型参数仅用于在编译时键入。您通知代码的其余部分，从响应中返回的对象将与Person兼容。如果响应不包含firstName或lastName属性，则除非您自己检查对象形状，否则代码仍无法正常工作。如果您希望该对象拥有方法或其他getter，则必须自己实例化它。

interface PersonResponse {
  firstName: string;
  lastName: string;
}

this.httpClient.post<Person>(url, body, headers).pipe(
  retry(ConfigurationService.apiHttpRetries),
  map(personProperties => new Person(personProperties),
);

所以你可以拥有

class Person {
  constructor({ firstName, lastName }) {
    this.firstName = firstName;
    this.lastName = lastName;
  }
  get FullName() { return `${this.firstName} + ' ' ${this.lastName}`; }
}

Answer 2

类构造函数中的

Object.assign()：

 class Person {
     firstName: string;
     lastName: string;;
         constructor(data: Object|Person) {
            Object.assign(this,data);
         }
      get FullName() { return `${this.firstName} + ' ' ${this.lastName}`; }
    }

    ...

        this.httpClient.post<Person>(url, body, headers).pipe(
              retry(ConfigurationService.apiHttpRetries),
              map(personProperties => new Person(personProperties),
       );

不需要自己映射每个属性：

this.firstName = firstName;
this.lastName = lastName;

Angular HttpClient映射从目标对象中删除getter

2 个答案: