Angular ng-repeat Error "Duplikate in einem Repeater sind nicht zulässig."

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 können, ist die ng-Wiederholung, in der der Filter verwendet wird, in einer anderen ng-Wiederholung verschachtelt

Der Filter ist wie folgt 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 zulässig. Repeater: Kommentar in item.comments | Bereich: 1: 2 ngRepeatAction @ https://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/an

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. Dies bedeutet, dass Sie eine Fehlermeldung erhalten, wenn Sie Folgendes versuchen.

// 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 geringfügig ä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

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

$scope.customers = JSON.parse(data)

Ich hatte ein Problem in meinem Projekt, bei dem ich ng-repeat track by $ index verwendete, aber die Produkte wurden nicht reflektiert, 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. Aber ich habe erfahren, dass $ index Probleme verursacht, wenn wir Daten aus dem Bereich herausgeben. Daher können die Datenverluste und das DOM nicht aktualisiert werden.

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

<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 dieselbe ID hat:

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

Schließlich habe ich das Problem gelöst, indem ich den dynamischen eindeutigen Schlüssel für ng-repeat wie folgt erstellt habe:

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

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

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

Hier ist ein funktionierendes Beispiel dessen, was Sie meiner Meinung nach versuchen: 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'
            ]
        }
    ];
}

Wenn dieser Fehler zufällig bei der Arbeit mit SharePoint 2010 auftritt: Benennen Sie Ihre .json-Dateierweiterungen um und aktualisieren Sie Ihren restService-Pfad. Es war kein zusätzlicher "Track by $ Index" erforderlich.

Zum Glück wurde mir dieser Link zu dieser Begründung weitergeleitet:

.json wird zu einem wichtigen Dateityp in SP2010. 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 einen solchen Fehler gibt.

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

Sobald die Dateierweiterungen geändert wurden, sollten alle festgelegt werden.

Nur für den Fall, dass dies jemand anderem passiert, ich dokumentiere dies hier. Ich habe diesen Fehler erhalten, weil ich das ng-Modell fälschlicherweise genauso eingestellt habe wie das ng-repeat-Array:

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

Anstatt:

<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 hatte keine Duplikate. Überprüfen Sie einfach Ihre Variablen.

Duplikate in einem Repeater sind nicht zulässig. Verwenden Sie den Ausdruck 'track by', 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>

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

Meine JSONAntwort war wie folgt:

{"items": 
   [
      {
      "index": 1,
      "name": "Samantha",
      "rarity": "Scarborough",
      "email": "[email protected]"
    },
      {
      "index": 2,
      "name": "Amanda",
      "rarity": "Vick",
      "email": "[email protected]"
    }]
}

Also habe ich es immer ng-repeat = "item in variables.items" angezeigt.

Duplikate in einem Repeater sind nicht zulässig. Verwenden Sie den Ausdruck 'track by', um eindeutige Schlüssel anzugeben. Repeater: sdetail in mydt, Duplicate key: string :, Duplicate value:

Ich bin auf diesen Fehler gestoßen, weil ich in meinem PHP-API-Teil einen falschen Datenbanknamen geschrieben habe ......

Daher kann dieser Fehler auch auftreten, wenn Sie die Daten aus der Datenbankbasis abrufen, deren Name von Ihnen falsch geschrieben wurde.