Categories
AngularJS Career

How to Fix Error: ngRepeat:dupes Duplicate Key in Repeater in AngularJS

Error: ngRepeat:dupes Duplicate Key in Repeater is the most common problem we are facing when we work with AngularJS. Why does it happen? It’s happened when there is any duplicate key is exist in ngRepeat expression. By default, AngularJS uses keys to populate the dom elements. So if there is any duplicate key found in ngRepeat expression, then the error happens.

Example:

Now assume we have data like this format. Here 5 is the duplicate number. And when we try to use ngRepeat expression and we will get Error: ngRepeat:dupes Duplicate Key in Repeater.

$scope.numbers = [1, 2, 3, 4, 5, 5];
<p ng-repeat="number in numbers">
    {{ number }}
</p>

To fixed this problem you have to use track by $index with ng-repeat.

<p ng-repeat="number in numbers track by $index">
    {{ number }}
</p>

The problem will be solved after using track by $index with ng-repeat.

By Sohel Rana

PHP Programmer, Software Engineer & Technology lover

Leave a Reply

Your email address will not be published. Required fields are marked *