javascript - Angular JSON - 使用 'track by' 表达式来

Question

我在 angular + Php + MySql 中制作一个 CRUD，我遇到了一个问题。 我在数据库中有一些数据，想在列表页面上显示它。

为了实现这一点，我在 Angular 中进行了 ajax 调用，并将响应放入范围变量中。如果我打印响应，它会在响应下方显示我，但无法以 HTML 显示。我遇到了一个问题，即:-

错误:[ngRepeat:dupes] 不允许在转发器中重复。使用“track by”表达式指定唯一键。 Repeater: person in crew, Duplicate key: string:, 重复值: "\""

下面是 Angular 和 HTML 代码:-

.controller('wrapperController', ['$scope','$rootScope','$http', function(scope,rootScope,http){

    http.post("server/viewRecords.php")
    .success(function(response){
        console.log(response);
        scope.crew = response;

    });
}])

<tr ng-repeat="person in crew">
            <td>{{person.name}}</td>
            <td>{{person.desc}}</td>
            <td> <a href="#/edit/{{$index}}">Edit</a> </td>
            <td> <a href="#/delete/{{$index}}" data-ng-click="deleteRecord($index)">Delete</a> </td>
        </tr>

请告诉我为什么会出现此错误？

谢谢!!

Answer 1

AngularJS 不允许在 ng-repeat 指令中重复。因此，您可以将 track by $index 添加到 ng-repeat 中，如下所示:

<tr ng-repeat="person in crew track by $index">
            <td>{{person.name}}</td>
            <td>{{person.desc}}</td>
            <td> <a href="#/edit/{{$index}}">Edit</a> </td>
            <td> <a href="#/delete/{{$index}}" data-ng-click="deleteRecord($index)">Delete</a> </td>
</tr>

Track by $index 告诉 Angular 使用自动递增的 $index 作为键，而不是数组中的每个单独元素。所以，它不会再重复了。