列表中的欺骗问题

Question

我在使用 Angular 设置列表时遇到了这个奇怪的问题。

Error: [ngRepeat:dupes]

我想做的是使用 $http 从 api 获取 som 数据，并在解析后设置源：

var jdata = JSON.parse(data);
$scope.Items = jdata;
console.log(jdata);

以上代码产生以上错误。我尝试添加 track by $index 但这会使列表出错，我得到了 XX 个毫无意义的元素（只有三个）。

如果我从控制台输出中获取数据并将 Items 设置为该值，它就可以正常工作！

$scope.Items = [{ "Id": 1, "OrganizationId": 1,... }];

那么可能是什么问题呢？只有当我从服务器 (ASP.NET Web API) 获取数据时，我才会遇到问题。如果我从控制台输出粘贴输出数据并使用它......它工作得很好！

我的标记：

           <div ng-repeat="item in Items">
                <p>{{item.Content}}</p>
                <p>{{item.State}}</p>
                <button ng-click="UnCompleteItem(item.Id)">UnComplete</button>
                <button ng-click="CompleteItem(item.Id)">Complete</button>
            </div>

我的数据（console.log(jdata)），3 项：

[{"Id":1,"OrganizationId":1,"Content":"Item1","State":1,"CreatedBy":1,"CreatedDate":"2015-02-28T10:25:24.208783+01:00","ModifyBy":0,"ModifyDate":"0001-01-01T00:00:00","CompletedBy":0,"CompletedDate":"0001-01-01T00:00:00"},{"Id":2,"OrganizationId":1,"Content":"Item2","State":1,"CreatedBy":1,"CreatedDate":"2015-02-28T10:25:24.208783+01:00","ModifyBy":0,"ModifyDate":"0001-01-01T00:00:00","CompletedBy":0,"CompletedDate":"0001-01-01T00:00:00"},{"Id":3,"OrganizationId":1,"Content":"Item3","State":1,"CreatedBy":1,"CreatedDate":"2015-02-28T10:25:24.208783+01:00","ModifyBy":0,"ModifyDate":"0001-01-01T00:00:00","CompletedBy":0,"CompletedDate":"0001-01-01T00:00:00"}]

Fiddle to play with

解决方案 (???):

感谢camden_kid我"figured"把它弄出来了。我不知道为什么但是从服务器解析字符串 2 (!!!) 次解决了问题。第一次使用 JSON.parse 然后使用 angular.fromJson:

            var jdata = JSON.parse(data);
            var jdata2 = angular.fromJson(jdata) // could also use JSON.parse again

            $scope.Items = jdata2;

虽然 console.log(jdata) 看起来像上面列出的数组，但输出 jdata 看起来像这样：

[Object, Object, Object] 在 Chrome 控制台输出中，现在有效了！！

我现在可以使用 $http 中的数据设置 $scope.Items，而且我也不需要 track by 部分！我对这个解决方案不满意，它看起来很老套，所以如果有人知道为什么我必须这样做，如果你能让我知道我会很高兴：D

Answer 1

JSON 解析数据似乎有问题。它返回一个字符串而不是一个对象。临时解决办法是重新解析：

var jdata = JSON.parse(jdata);

列表中的欺骗问题

Problems with dupes in list

angularjs

angularjs-ng-repeat