美元http.获取返回格式错误的数据

$http.get returning malformed data

本文关键字：错误 数据 格式 返回 http 获取 美元      更新时间：2023-09-26

我正在学习Angular.js，今天是我学习的第二天。下面是一个简单的函数

var XApp = angular.module("XApp", ['ngResource']);
XApp.controller('MenuParentController', function ($scope, $http) {
    $http.get('api/menu?type=json').success(function (data) {
        console.log('Inside MenuParentController ' + JSON.parse(data));
        $scope.parentItems = JSON.parse(data);
     });
})

console.log的输出如下:

Inside MenuParentController [{"NodeId":261,"ParentId":9,"NodeName":"Clothing"},{"NodeId":262,"ParentId":9,"NodeName":"Jewellery"},{"NodeId":263,"ParentId":9,"NodeName":"Bags"},{"NodeId":12,"ParentId":1,"NodeName":"Home Décor"},{"NodeId":10,"ParentId":1,"NodeName":"Stationery & Office Supplies"},{"NodeId":811,"ParentId":1,"NodeName":"Gifts"}]

我得到的错误是:

Error: [ngRepeat:dupes] http://errors.angularjs.org/1.2.14/ngRepeat/dupes?p0=item%20in%20parentItems&p1=string%3Ad

做JSON.parse(data)[0]给出[作为输出，这是错误的。应该是{"NodeId":261,"ParentId":9,"NodeName":"Clothing"}

HTML: 

<li data-ng-repeat="item in parentItems"><a href="/{{ item.NodeId }}/{{ item.NodeName }}" title="{{ item.NodeName }}" class="newMenuClass {{item.NodeName | lowercase }}">{{ item.NodeName }}</a></li>
在某种程度上，Angular把JSON对象的每个字符都当作对象的属性来处理。知道为什么吗?编辑:

当我使用$。Ajax一切正常

$.ajax({
        url: 'api/menu?type=json',
        dataType: 'json',
        async: false,
        success: function (data) {
            console.log('Inside MenuParentController ' + data);
            $scope.parentItems = JSON.parse(data);
        }
    });

EDIT 2:

当我点击http://localhost:57086/api/menu?type=json时，这是我得到的输出

"[{'"NodeId'":261,'"ParentId'":9,'"NodeName'":'"Clothing'"},{'"NodeId'":262,'"ParentId'":9,'"NodeName'":'"Jewellery'"},{'"NodeId'":263,'"ParentId'":9,'"NodeName'":'"Bags'"},{'"NodeId'":12,'"ParentId'":1,'"NodeName'":'"Home Décor'"},{'"NodeId'":10,'"ParentId'":1,'"NodeName'":'"Stationery & Office Supplies'"},{'"NodeId'":811,'"ParentId'":1,'"NodeName'":'"Gifts'"}]"

好吧。

错误是将数据序列化两次，导致包含实际JSON数据的单个字符串。

$.ajax with dataType: 'json'在将数据传递给success回调之前隐式反序列化数据。这就是为什么JSON.parse调用在第二次反序列化运行时成功了。

相关文章：