如何在ng repeat angular js中使用$index

Question

我已经发布了我的问题如何使用angular js 从多维数组创建复选框

但我没有得到任何回应。当我要添加第二个ng-repeat时，我已经调试了我的代码。我正在获得

错误：ngRepeat:重复中继器中的重复密钥

当我添加repeat by $index时，我得到了单个字符作为密钥和值太

请帮我，我是新的角度js:（

这是我的密码http://jsfiddle.net/ashishoft/03L3faq5/2/

Answer 1

以下是示例：

ng-repeat="i in items track by $index"

Answer 2

真的很简单。您甚至可以将它与自定义指令等结合使用。它基本上是您在循环中所处位置的索引。

不过，使用它也有一些缺陷。如果你创建了一个ng重复列表，然后将$index传递到某个点击函数或其他函数中，那么如果你也在同一列表上使用过滤，你可能会遇到问题。$索引可能与过滤器不同步，让你想知道为什么它会给你错误的数据。

例如：

<li ng-repeat="page in links | someFilter:filter">
    <a ng-click="someFunction($index)">{{ someData }}</a>
</li>

vs更好的方式：

<li ng-repeat="itemX in someData | someFilter:filter">
    <a ng-click="someFunction(itemX)">{{ itemX.name }}</a>
</li>

因此，尽管我在下面的例子中使用了$index，但在每行执行更复杂的函数时，最好只传递整个对象。

HTML:

<div ng-app="myApp" ng-controller="MainCtrl">
    <ul>
        <li ng-repeat="page in links">
            <a ng-class="{ testClass: $index == pageNumber }" ng-click="setPageNumber($index)">{{ page }}</a>
        </li>
    </ul>
</div>

Javascript：

var app = angular.module('myApp', []);
app.controller('MainCtrl', function($scope) {
    $scope.links = [
        'Link One',
        'Link Two',
        'Link Three'
    ];
    $scope.pageNumber = 0;
    $scope.setPageNumber = function(index) {
        $scope.pageNumber = index;
    }
});

CSS：

.testClass {
    background: black;
    color: white;
}

Answer 3

这是一个如何编写它的示例，尽管使用$index也很好。我可以建议使用其他元素，比如元素id或title吗？这里有一篇关于ng repeat的文章。

<div class="favorite-children" ng-repeat="photo in ctrl.favorties track by $index">
    <div class="card"></div>
</div>
  //or
<div class="favorite-children" ng-repeat="photo in ctrl.favorties track by photo.title">
  <div class="card"></div>
</div>

更新

试试这个FIDDLE来预览一个全面的JSON，并预览你如何使用它的相同代码。希望它能有所帮助。