aurelius
aurelius

Reputation: 4076

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed

I have a similar situation as described here but I use a $http call to get my data to build a infinite scrolling table, and get:

Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: i in items, Duplicate key: string:b, Duplicate value: b

source code is here

this is the source code that i followed and it worked

i need help in this situation!

thanks

Upvotes: 1

Views: 3875

Answers (3)

Harold Ship
Harold Ship

Reputation: 1019

You have a few issues in your jsFiddle. As noted above by @Manjesh V, you need to add track by $index, giving you:

<li ng-repeat="i in items track by $index">{{i.name}}</li>

Also, as mentioned by @sMr, you need to add $http module to the directive.

Finally, your jsFiddle links to a really old version of AngularJS, v1.0.0. You can add 1.2.1 and it will work.

Upvotes: 4

Manjesh V
Manjesh V

Reputation: 1240

Duplicate Items in the array, If you want to ignore use track by $index

<li ng-repeat="i in items track by $index">{{i.name}}</li>

Upvotes: 3

semirturgay
semirturgay

Reputation: 4201

it seems to be you have not passed the $http module to your main controller.

function Main($scope,$http) {
    $scope.items = [];

        $scope.loadMore = function() {
        $http.get('/echo/json').
                success(function(data, status, headers, config) {
                    // this callback will be called asynchronously
                    // when the response is available
                    $scope.items += data;
                }).
                error(function(data, status, headers, config) {
                    // called asynchronously if an error occurs
                    // or server returns response with an error status.
                    console.log("call failed");
                });
    };
    $scope.loadMore();
} 

working demo

Upvotes: 1

Related Questions