2015-10-08 47 views
6

direttiva ripetuta che emette record di vino da un'API. Ho una funzione di fabbrica per servire fino API vino che viene poi letta nel mio controllerErrore: [ngRepeat: dupes] cosa significa?

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> 

ho cliccato su questo errore e in tipico "vaga" angularjs moda ottengo questo :

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 

Cosa significa? il vino non è lo stesso di "vini", quindi perché pensa che sia un duplicato?

risposta

10

Si verifica se sono presenti chiavi duplicate in un'espressione ngRepeat. Le chiavi duplicate sono vietate perché AngularJS utilizza le chiavi per associare i nodi DOM agli elementi.

Ciò significa che $ scope.wines ha alcuni valori che sono duplicati.

Si può anche fare riferimento questo post: Angular ng-repeat Error "Duplicates in a repeater are not allowed."

+0

Grazie ma ancora non ha senso per me. Inoltre ho aggiunto http://www.greatwines.9000.com/wines alla fine della richiesta HTTP e per qualche motivo ora funziona. Continuo a imbattersi in questi misteriosi bug e correzioni con angularjs. Non è molto coerente. – HGB