首页 > 解决方案 > 来自 Angular http 的 JSON 对象没有正确反序列化

问题描述

首先是我的运行版本:node v12.13.1 | npm 6.12.1

我在理解为什么这不能正确反序列化时遇到一些问题。我从我的休息服务收到以下回复。

{ "numbers":[],
  "batches":[ 
    { "id":"AB3E809","status":"1"},
    { "id":"EEF32A9","status":"0"}] }

这些是我在尝试键入数据时使用的 TypeScript 接口。

interface NumJson {
  status: string,
  num: string
}

interface BatchJson {
  id: string,
  status: string
}

interface Status {
  numbers: NumJson[],
  batches: BatchJson[];
}

从我的 Angular 服务进行这些调用时,它似乎无法正确识别或访问数据。

this.http.get<any>(url).subscribe({
  next: (data: Status) => {
    console.log(data);              // same as JSON above
    console.log(data.numbers);      // undefined
    console.log(data.batches);      // undefined
}

this.http.get<any>(url).subscribe({
  next: (data: any) => {
    console.log(data);              // same as JSON above
    console.log(data.numbers);      // undefined
    console.log(data.batches);      // undefined
}

对此的任何见解都会很棒,因为这是唯一有问题的订阅。

标签: javascriptjsonangulartypescript

解决方案


在“Kurt Hamilton”的一些发人深省的例子之后,我发现了这个问题。我的问题是其余服务如何返回我的数据。

正确格式化的数据在控制台中应如下所示:

预期产出

我的输出显示字符串;这让我质疑为什么我的数据是一个字符串,而不是控制台中的一个对象。(远离这个问题的一个很好的注意事项)

检查其余服务后,我意识到它正在做双重序列化。一旦我纠正了这一点,数据输出看起来并正确运行。


推荐阅读