Question

我已经发布了我的问题 How to create check box from multidimensional array using angular js

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

错误：ngRepeat：dupes Repeater中的重复键

当我添加repeat by $index时，我将获得单个字符作为键和值

请帮助我，我是角度js的新手:(

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

的小提琴

Answer 1

以下是示例：

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

Answer 2

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

虽然使用它有一些缺陷。如果你创建一个ng-repeat列表，然后将$ index传递给某些click功能，那么如果你也在同一个列表上使用过滤，那么你可能会遇到问题。 $ index可能与过滤器不同步，让您想知道为什么它会给您错误的数据。

例如：

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

与更好的方式：

<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或标题的内容，这里有一篇文章讨论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，并预览相同的代码以了解如何使用它。希望它有所帮助。

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

3 个答案: