webentwicklung-frage-antwort-db.com.de

Angular ng-repeat Fehler "Duplikate in einem Repeater sind nicht erlaubt."

Ich definiere einen benutzerdefinierten Filter wie folgt:

<div class="idea item" ng-repeat="item in items" isoatom>    
    <div class="section comment clearfix" ng-repeat="comment in item.comments | range:1:2">
        ....
    </div>
</div>

Wie Sie sehen, ist die ng-Wiederholung, in der der Filter verwendet wird, in einer anderen ng-Wiederholung verschachtelt

Der Filter ist folgendermaßen definiert:

myapp.filter('range', function() {
    return function(input, min, max) {
        min = parseInt(min); //Make string input int
        max = parseInt(max);
        for (var i=min; i<max; i++)
            input.Push(i);
        return input;
    };
});

Ich erhalte:

Fehler: Duplikate in einem Repeater sind nicht erlaubt. Repeater: Kommentar in item.comments | range: 1: 2 ngRepeatAction @ https://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/an

461
Dine

Die Lösung wird hier tatsächlich beschrieben: http://www.anujgakhar.com/2013/06/15/duplicates-in-a-repeater-are-not-allowed-in-angularjs/

AngularJS erlaubt keine Duplikate in einer ng-repeat-Direktive. Wenn Sie also Folgendes versuchen, wird eine Fehlermeldung angezeigt.

// This code throws the error "Duplicates in a repeater are not allowed.
// Repeater: row in [1,1,1] key: number:1"
<div ng-repeat="row in [1,1,1]">

Wenn Sie den obigen Code jedoch leicht ändern, um einen Index zu definieren, um die Eindeutigkeit wie folgt zu bestimmen, funktioniert er wieder.

// This will work
<div ng-repeat="row in [1,1,1] track by $index">

Offizielle Dokumente finden Sie hier: https://docs.angularjs.org/error/ngRepeat/dupes

941
Webnet

Stellen Sie für diejenigen, die JSON erwarten und dennoch den gleichen Fehler erhalten, sicher, dass Sie Ihre Daten analysieren:

$scope.customers = JSON.parse(data)
43
usefulBee

Ich hatte ein Problem in meinem Projekt, bei dem ich den ng-repeat-Track von $ index verwendet habe, aber die Produkte spiegelten sich nicht wieder, wenn Daten aus der Datenbank stammen. Mein Code ist wie folgt:

<div ng-repeat="product in productList.productList track by $index">
  <product info="product"></product>
 </div>

Im obigen Code ist product eine separate Anweisung zum Anzeigen des Produkts. Ich habe jedoch erfahren, dass $ index ein Problem verursacht, wenn wir Daten aus dem Gültigkeitsbereich herausgeben. So können die Datenverluste und DOM nicht aktualisiert werden.

Ich fand die Lösung, indem ich product.id wie folgt als Schlüssel für ng-repeat verwendete:

<div ng-repeat="product in productList.productList track by product.id">
  <product info="product"></product>
 </div>

Der obige Code schlägt jedoch erneut fehl und löst den folgenden Fehler aus, wenn mehr als ein Produkt mit derselben ID geliefert wird:

angle.js: 11706 Error: [ngRepeat: dupes] Duplikate in einem Repeater sind nicht zulässig. Verwenden Sie den Ausdruck 'track by', um eindeutige Schlüssel anzugeben. Repeater

Schließlich löste ich das Problem, indem ich den dynamischen eindeutigen Schlüssel von ng-repeat wie folgt erstellte:

<div ng-repeat="product in productList.productList track by (product.id + $index)">
  <product info="product"></product>
 </div>

Dies hat mein Problem gelöst und ich hoffe, dies wird Ihnen in Zukunft helfen.

11
Mahima Agrawal

Was beabsichtigen Sie mit Ihrem "Bereichs" -Filter zu tun?

Hier ist ein funktionierendes Beispiel von dem, was ich denke , was Sie versuchen zu tun: http://jsfiddle.net/evictor/hz4Ep/

HTML:

<div ng-app="manyminds" ng-controller="MainCtrl">
  <div class="idea item" ng-repeat="item in items" isoatom>    
    Item {{$index}}
    <div class="section comment clearfix" ng-repeat="comment in item.comments | range:1:2">
      Comment {{$index}}
      {{comment}}
    </div>
  </div>
</div>

JS:

angular.module('manyminds', [], function() {}).filter('range', function() {
    return function(input, min, max) {
        var range = [];
        min = parseInt(min); //Make string input int
        max = parseInt(max);
        for (var i=min; i<=max; i++)
            input[i] && range.Push(input[i]);
        return range;
    };
});

function MainCtrl($scope)
{
    $scope.items = [
        {
            comments: [
                'comment 0 in item 0',
                'comment 1 in item 0'
            ]
        },
        {
            comments: [
                'comment 0 in item 1',
                'comment 1 in item 1',
                'comment 2 in item 1',
                'comment 3 in item 1'
            ]
        }
    ];
}
5
Ezekiel Victor

Wenn dieser Fehler zufällig bei der Arbeit mit SharePoint 2010 auftritt: Benennen Sie die JSON-Dateierweiterungen um und aktualisieren Sie den restService-Pfad. Es wurde kein zusätzlicher "track by $ index" benötigt.

Zum Glück wurde ich weitergeleitet link zu dieser Begründung:

.json wird in SP2010 zu einem wichtigen Dateityp. SP2010 enthält bestimmte Webservice-Endpunkte. Der Speicherort dieser Dateien ist der Ordner 14Hive\isapi. Die Erweiterung dieser Dateien lautet .json. Das ist der Grund, warum es so einen Fehler gibt.

"kümmert sich nur darum, dass der Inhalt einer json-Datei json ist - nicht die Dateierweiterung"

Sobald die Dateierweiterungen geändert wurden, sollte alles eingestellt sein.

1
CR Rollyson

Duplikate in einem Repeater sind nicht erlaubt. Verwenden Sie den Ausdruck "Verfolgen nach", um eindeutige Schlüssel anzugeben.

Repeater: {0}, Duplicate key: {1}, Duplicate value: {2}

Beispiel

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="angular.js"></script>

</head>
<body>
    <div ng-app="myApp" ng-controller="personController">
        <table>
            <tr> <th>First Name</th> <th>Last Name</th> </tr>
            <tr ng-repeat="person in people track by $index">
                <td>{{person.firstName}}</td>
                <td>{{person.lastName}}</td>
                <td><input type="button" value="Select" ng-click="showDetails($index)" /></td>
            </tr>

        </table> <hr />
        <table>
            <tr ng-repeat="person1 in items track by $index">
                <td>{{person1.firstName}}</td>
                <td>{{person1.lastName}}</td>
            </tr>
        </table>
        <span>   {{sayHello()}}</span>
    </div>
    <script> var myApp = angular.module("myApp", []);
        myApp.controller("personController", ['$scope', function ($scope)
        { 
            $scope.people = [{ firstName: "F1", lastName: "L1" },
                { firstName: "F2", lastName: "L2" }, 
                { firstName: "F3", lastName: "L3" }, 
                { firstName: "F4", lastName: "L4" }, 
                { firstName: "F5", lastName: "L5" }]
            $scope.items = [];
            $scope.selectedPerson = $scope.people[0];
            $scope.showDetails = function (ind) 
            { 
                $scope.selectedPerson = $scope.people[ind];
                $scope.items.Push($scope.selectedPerson);
            }
            $scope.sayHello = function ()
            {
                return $scope.items.firstName;
            }
        }]) </script>
</body>
</html>
0
Yogesh Sharma

Wenn Sie ein ng-repeat innerhalb eines <ul> -Tags aufrufen, können Sie möglicherweise Duplikate zulassen. Siehe diesen Link als Referenz. Siehe Todo2.html

0
TheUnKnown

Nur für den Fall, dass dies jemand anderem passiert, ich dokumentiere dies hier, ich habe diese Fehlermeldung erhalten, weil ich versehentlich das ng-Modell auf das gleiche wie das ng-repeat-Array gesetzt habe:

 <select ng-model="list_views">
     <option ng-selected="{{view == config.list_view}}"
         ng-repeat="view in list_views"
         value="{{view}}">
         {{view}}
     </option>
 </select>

Anstatt von:

<select ng-model="config.list_view">
     <option ng-selected="{{view == config.list_view}}"
         ng-repeat="view in list_views"
         value="{{view}}">
         {{view}}
     </option>
 </select>

Ich habe das Array überprüft und keine Duplikate gefunden. Überprüfen Sie einfach Ihre Variablen.

0
Miguel Suarez