对象数组的角度JSON过滤器

时间:2013-10-07 15:26:45

标签: javascript json angularjs

我使用$ http来获取用户集合。来自服务器的原始响应是......

[{"id":2,"name":"John Doe","email":"johndoe@infosnap.com"}]

在成功回调中记录数据参数会显示此...

[Object, each: function, eachSlice: function, all: function, any: function, collect: function…]
  0: Object
    $$hashKey: "004"
    email: "johndoe@infosnap.com"
    id: 2
    name: "John Doe"
    __proto__: Object
  length: 1
__proto__: Array[0]

足够好。看起来$ http已经将原始JSON反序列化为JavaScript对象。

接下来,我将数据分配给成功回调内的$ scope变量,以便在浏览器中执行一些调试......

$scope.debug = data;

现在,在我看来,我想将它显示为漂亮的JSON以便进行调试。

<pre>{{debug | json}}</pre>

我明白了......

"[{\"id\": 2, \"name\": \"John Doe\", \"email\": \"johndoe@infosnap.com\", \"$$hashKey\": \"004\"}]"

我想要得到这样的东西......

[
  {
    "id": 2,
    "name": "John Doe",
    "email": "johndoe@infosnap.com",
    "$$hashKey": "004"
  }
]

我还尝试在控制器中对javascript数组进行字符串化...

$scope.debug = JSON.stringify(data, true);

并且不使用过滤器...

<pre>{{debug}}</pre>

但是我得到了相同的结果,除了删除了$$ hashKey ......

"[{\"id\": 2, \"name\": \"John Doe\", \"email\": \"johndoe@infosnap.com\"}]"

如果我只是将数组中的第一项指定给$ scope,并使用json过滤器,它就可以正常工作......

$scope.debug = data[0];

在我看来......

<pre>{{debug | json}}</pre>

结果......

{
  "id": 2,
  "name": "John Doe",
  "email": "johndoe@infosnap.com"
}

我知道还有其他方法可以得到我想要的东西。我只是想了解发生了什么。

谢谢!

1 个答案:

答案 0 :(得分:1)

你应该解析json而不是stringify。

试试这个:

$scope.debug = JSON.parse(data)

Working Fiddle