Question

嘿所以我的角度应用程序中有关于重复数据的问题。我已经将问题确定为精确的ng-repeat，但我看不出它有什么问题。我收到一个错误，说我有重复的数据，但我看不出它是怎么回事，因为我目前在我的数据库中只有4个项目。我已经尝试了不同的事情，比如重命名等等，但对我来说它看起来是正确的，所以我有点难过为什么我得到错误。我想也许数据被加载两次但不确定如何？无论如何，我会发布相关的代码，如果有一些有角度的神可以指出我的方式，我将永远感激。

错误消息是： angular.min.js：84错误：[ngRepeat：dupes] http://errors.angularjs.org/1.2.9/ngRepeat/dupes?p0=task%20in%20tasks%20track%20by%20task.id%20%7C%20filter%20%3A%20filterTask&p1=undefined

的JavaScript

app.controller('tasksController', function ($scope, $http) {
    getTask(); // Load all available tasks 

    function getTask() {
        $http.post('ajax/getTask.php').success(function (data) {
            $scope.tasks = data;
        });
    }

    $scope.addTask = function (task) {
        $http.post('ajax/addTask.php?task=' + task).success(function (data) {
            getTask();
            $scope.taskInput = '';
        });
    };

    $scope.deleteTask = function (task) {
        if (confirm('Are you sure to delete this line?')) {
            $http.post('ajax/deleteTask.php?taskID=' + task).success(function (data) {
                getTask();
            });
        }
    };

    $scope.toggleStatus = function (item, status, task) {
        if (status == '2') {
            status = '0';
        } else {
            status = '2';
        }
        $http.post('ajax/updateTask.php?taskID=' + item + '&status=' + status).success(function (data) {
            getTask();
        });
    };
});

HTML：

<div class="task">
    <label class="checkbox" ng-repeat="task in tasks track by task.id | filter : filterTask">
        <input
            type="checkbox"
            value="{{task.STATUS}}"
            ng-checked="task.STATUS==2"
            ng-click="toggleStatus(task.ID,task.STATUS, task.TASK)"/>
        <span ng-class="{strike:task.STATUS==2}">{{task.TASK}} [{{task.ID}}]</span>
        <a ng-click="deleteTask(task.ID)" class="pull-right"><i class="glyphicon glyphicon-trash"></i></a>
    </label>
</div>

Answer 1

正如link in the error message建议的那样，您可以使用track by：

解决此问题

<div ng-repeat="value in [4, 4] track by $index"></div>

Answer 2

您需要注意的事情很少 1）尝试console.log($scope.tasks)并查看返回的内容。它可能会返回你没想到的东西。它应该是基于你的数据库的4个对象的数组，并且很可能是项目的id被重复。

2）如果存在重复的id，请尝试使用$ index跟踪，因为它保证是唯一的。这应该可以解决您的错误消息问题。

3）track by应放在表达式的末尾，即过滤后。如果没有，您将注意到即使您成功删除了步骤1中的错误消息，也不会应用过滤器表达式。

您的代码应该正常使用。

<label class="checkbox" ng-repeat="task in tasks | filter: filterTask track by $index">...</label>

ng：重复欺骗。在ng-repeat中获取重复数据

2 个答案: