ng-repeat上"不允许在转发器中复制"

Question

我从服务请求返回了以下json数据:

{
    "entries": [{
        "id": 2081,
        "name": "BM",
        "niceName": "bodmas"
        }]
    }, {
        "id": 8029,
        "name": "Mas",
        "niceName": "Masm"
        }]
    }],
    "count": 2
}

我在html中尝试以下代码来循环遍历这些数据:

<option ng-repeat="entry in entries" value="{{entry.name}}">{{entry.name}}</option>

运行代码时出现以下错误:

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: entry in entries, Duplicate key: string:c

以下是我的控制器的代码:

myApp.controller("MyController", ['$scope', '$http', '$log', function($scope, $http, $log){
       ...

       $http.get('https://myServiceURL').success(function(data){
                    $scope.entries = data;
        });
}]);

有人可以帮我理解为什么我会收到这个错误？

Answer 1

添加track by $index到您的ng重复,而不是:

<option ng-repeat="entry in entries" value="{{entry.name}}">{{entry.name}}</option>

尝试:

<option ng-repeat="entry in entries track by $index" value="{{entry.name}}">{{entry.name}}</option>

有关此错误消息的文档中有关于此的更多信息 :

在ngRepeat表达式中存在重复键时发生.禁止重复键,因为AngularJS使用键将DOM节点与项目关联.

默认情况下,集合通过引用进行键控,这对于大多数常见模型来说是理想的,但对于实际的基本类型(共享引用)可能会有问题.

Answer 2

您的JSON无效,应该是:

{
    "entries": [{
        "id": 2081,
        "name": "BM",
        "niceName": "bodmas"
    }, {
        "id": 8029,
        "name": "Mas",
        "niceName": "Masm"
    }],
    "count": 2
}

此外,请确保您正在访问正确级别的文档,使用:

$http.get('https://myServiceURL').success(function(data){
    $scope.entries = data.entries;
});

然后,它应该工作.看到这个JSBin.

Answer 3

如果我可以添加一个额外的原因,为什么会发生这种情况......

如果您使用JS对象[]或{}执行此操作

并且你将它传递给这样的指令

<my-directive my-attribute="{{ myObject }}"></my-directive>

在指令中,您必须通过执行此操作将myObject变回对象

...
controller: function( $scope ){

  $scope.links = $scope.$eval( $scope.myObject );
....

然后HTML和ng-repeat将起作用

...
<span class="" ng-repeat="link in links">
...

ngRepeat不知道如何重复单个字符串.

这是$ scope.$ eval之前对象的样子

"[{ hello: 'you' }]"

在$ scope之后.$ eval()

[{ hello: 'you' }] an actual object to repeat over.

错误类型使得它不能重复字符串的引用.这是我得到的错误.

错误:[ngRepeat:dupes] http://errors.angularjs.org/1.3.0-beta.8/ngRepeat/dupes?p0=link%20in%20links&p1=string%3Al