Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
409 views
in Technique[技术] by (71.8m points)

duplicates - Error: [ngRepeat:dupes] what does this mean?

repeat directive outputing wine records from an api. I have a factory function to serve up the wine API which is then accessed in my controller

app.factory("Wine", function ($http){
     var factory = {};

     //getWines 
     factory.getWines = function(){ 
      return $http.get("http://www.greatwines.9000.com")
     }

}

Controller:

    app.controller("winesCtrl", function($scope, $http, Wine){
        Wine.getWines()
         .success(function(wines){
           $scope.wines = wines;
        })
        .error(function(){
             alert("Error!");
         });
    });

VIEW:

<h2>Wine list</h2>
    <div class="row margin-top-20 wine-container" ng-repeat="wine in wines">
        <div class="col-sm-3">
            <img src="{{wine.picture}}" class="img-responsive" />
        </div>
        <div class="col-sm-9">
            <div class="margin-top-20">
                <span class="bold">Name: </span><span>{{wine.name}}</span>
            </div>
            <div>
                <span class="bold">Year: </span><span>{{wine.year}}</span>
            </div>
            <div>
                <span class="bold">Grapes: </span><span>{{wine.grapes}}</span>
            </div>
            <div>
                <span class="bold">Country: </span><span>{{wine.country}}</span>
            </div>
            <div>
                <span class="bold">Region: </span><span>{{wine.region}}</span>
            </div>
            <div>
                <span class="bold">Price: </span><span>{{wine.price}}</span>
            </div>
            <div>
                <span class="bold">{{wine.description}}</span>
            </div>
            <div class="margin-top-20">
                <a href="#/wines/{{wine.id}}" class="btn btn-default">Edit Wine</a>
            </div>
        </div>
    </div>

I clicked on this error and in typical "vague" angularjs fashion I get this:

Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: wine in wines, Duplicate key: string:e, Duplicate value: e

What does this mean? wine is not the same as "wines" so why does it think it is a duplicate?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Occurs if there are duplicate keys in an ngRepeat expression. Duplicate keys are banned because AngularJS uses keys to associate DOM nodes with items.

This means that $scope.wines have some values which are duplicate.

You can also refer this post : Angular ng-repeat Error "Duplicates in a repeater are not allowed."


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...