Question

我有这个将$ scope.comments数组绑定到无序列表的html;

<div ng-app="" ng-controller="commentController">
    <ul>
        <li ng-repeat="c in comments">
            {{ c }}
        </li>
    </ul>
<div>

然后这个脚本初始化并向列表中添加更多项目;

<script>
    function commentController($scope){
        $scope.comments = ['Hi There.'];
        $scope.addComment = function(){
            $scope.comments.push($scope.newcomment);
            $scope.newcomment='';
        };
    };   
</script>

这样可以正常工作，直到我尝试添加重复的项目。调试显示Javascript确实将重复项目推送到数组，但角度数据绑定不再更新列表。

知道为什么，或者我做错了什么？

Answer 1

使用此代码：

<div ng-app="" ng-controller="commentController">
    <ul>
        <li ng-repeat="c in comments track by $index">
            {{ c }}
        </li>
    </ul>
<div>

track by $index按索引跟踪数组元素，而不是按值跟踪。请参阅详情

中的this

Answer 2

您需要按索引而不是值进行跟踪，因此在ng-repeat editthis

中

ng-repeat="c in comments track by $index"

当数组具有重复值时，角度数据绑定停止工作

2 个答案: