Angular 2 - 将 JSON 解析为具有计算属性的类

Posted 2023-03-13

【中文标题】Angular 2 - 将 JSON 解析为具有计算属性的类

【英文标题】：Angular 2 - Parsing JSON to class with computed properties

【发布时间】：2017-11-30 10:14:04

【问题描述】：

我正在尝试转换一个 JSON 对象，该对象作为一个可用的 TypeScript 类返回，该类也具有计算属性。

映射时，它会正确获取所有返回值，但会删除/忽略对象上也应该存在的计算属性，无论我是否对它们有默认值。

想要的结果是 ShowPanel 默认为 true

export class Maintenance 
  Id?: number;
  Name?: string;

  // computed property - doesn't exist on returned data as it's a client 
  // property in an ngFor loop.
  ShowPanel: boolean = true;


@Component(
  moduleId: module.id,
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
)
export class HomeComponent 
   ngOnInit()
      this.http.get('lookup/getstatusinformation')
               .map(res => <Maintenance[]>res.json())
               .subscribe(res => this.listMaintenance = res);

   

【问题讨论】：

请记住 res.json() 只会返回 JSON 格式的字符串。您可以通过接口将其映射到 POJO，但是如果要创建类实例数组，则需要使用类的构造函数方法循环 .json() 返回和实例化新对象

@Jota.Toledo 作者将 json 数据转换为 .map 函数中的维护类型数组

TypeScript 不进行任何转换。您断言来自json() 的返回值是Maintenance 实例，但它不是。它只是一个对象。如果你想要一个Maintenance 实例，你必须使用new 等创建一个。

@YD1m 这意味着什么，普通对象仍然不是维护的实例。例如，如果维护有一个 foo() 方法，则不能从服务返回的对象之一调用它。在组件方法中进行直接转换有点愚蠢，最好在服务方法上声明返回类型

@Jota.Toledo 好的，你是对的。谢谢你的详细描述。

【参考方案1】：

当 JSON 反序列化后，JSON 数据中未提供的任何属性都将在目标对象上设置为其默认值 - 就好像该默认值是响应的一部分一样。

就我个人而言，我会在创建后遍历对象并重置计算值。