“Doublons dans un répéteur ne sont pas autorisés” sur ng-repeat

J'ai de la suite de données json renvoyé d'un service à la demande:

{
    "entries": [{
        "id": 2081,
        "name": "BM",
        "niceName": "bodmas"
        }]
    }, {
        "id": 8029,
        "name": "Mas",
        "niceName": "Masm"
        }]
    }],
    "count": 2
}

Et je suis en train d'essayer le code suivant dans le code html de la boucle grâce à ces données:

<option ng-repeat="entry in entries" value="{{entry.name}}">{{entry.name}}</option>

J'obtiens l'erreur suivante lorsque j'exécute le code:

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

Voici le code de mon contrôleur:

myApp.controller("MyController", ['$scope', '$http', '$log', function($scope, $http, $log){
       ...

       $http.get('https://myServiceURL').success(function(data){
                    $scope.entries = data;
        });
}]);

Quelqu'un pourrait m'aider à comprendre pourquoi j'obtiens cette erreur?

Ne devriez-vous pas faire $scope.entries = data.entries; dans votre contrôleur ?
Votre message d'erreur ne semble pas appartenir à cet extrait de code que vous avez fournis. Il mentionne make in makes lorsque votre exemple dit entry in entries. Avez-vous une liste de chaînes de caractères appelée makes portée? Si oui, c'est la chose qui a besoin de l' track by ajouté.
double possible de Angulaire ng-repeat Erreur "Doublons dans un répéteur ne sont pas autorisés."
J'ai essayé de simplifier les choses à l'aide de l'entrée pour make et entries pour makes, à tort oublié de modifier le message d'erreur. Désolé.
Loggin de données.des entrées est de me donner undefined dans le résultat.
J'ai essayé d'utiliser entry in entries tracy by $index comme <option ng-repeat="entry in entries track by $index" value="{{$index}}">{{$index}}</option> et il fonctionne très bien, mais j'ai l'index imprimé pour la option élément et son value, comme 1,2,3.... Je ne pense pas qu'il y aurait une double entrée dans le retourné de données JSON. Pensez-vous que les données retournées pourraient être utilisées de la façon dont je l'utilise. Est son format correct pour être utilisé pour faire une boucle dans un tableau?
Comment imprimer la name des entrées dans la option élément et sa valeur?
Avez-vous essayez seulement l'ajout de track by $index et de ne pas modifier vos autres expressions de $index? e.g <option ng-repeat="entry in entries track by $index" value="{{entry.name}}">{{$entry.name}}</option>

InformationsquelleAutor skip | 2014-07-27

11

Votre JSON n'est pas valide et doit être :
```
{
    "entries": [{
        "id": 2081,
        "name": "BM",
        "niceName": "bodmas"
    }, {
        "id": 8029,
        "name": "Mas",
        "niceName": "Masm"
    }],
    "count": 2
}
```
Aussi, assurez-vous que vous accédez au document au bon niveau, utilisation :
```
$http.get('https://myServiceURL').success(function(data){
    $scope.entries = data.entries;
});
```
Ensuite, il devrait fonctionner. Voir ce JSBin.
- Vous étaient sur place en disant avec $scope.entries = data.entries; dans votre commentaire. L'erreur que je faisais quand j'étais en appelant le service était que j'étais emballage de la réponse JSON dans une fonction de rappel qui, tout en parcourant les $scope.entries a été à l'origine du problème et de me donner undefined pour console.log(data.entries);. Merci:)
- Dans le même esprit, j'ai eu une réponse PHP avec json_encoded de données; dans le code javascript, j'ai oublié de JSON.parse() de l'objet,... il a bien fonctionné pendant un certain temps jusqu'à ce que les données de retour eu plus complexe.
InformationsquelleAutor Goodzilla
38

Ajouter track by $index à votre ng répéter ainsi, au lieu de:
```
<option ng-repeat="entry in entries" value="{{entry.name}}">{{entry.name}}</option>
```
Essayer:
```
<option ng-repeat="entry in entries track by $index" value="{{entry.name}}">{{entry.name}}</option>
```
Il y a d'autres informations à ce sujet dans
la documentation de ce message d'erreur:

Se produit si il y a des doubles de clés dans un ngRepeat expression.
Des doubles de clés sont interdits parce que AngularJS utilise des clés pour associer les DOM
les nœuds avec les éléments.

Par défaut, les collections sont conçus par référence à ce qui est souhaitable pour
la plupart des modèles courants, mais peut être problématique pour les types primitifs qui sont
interné (partage de références).
- Cela ressemble à une réponse plausible, mais il pourrait être amélioré avec une explication de pourquoi cela est nécessaire, par exemple, ce "suivi" est tout au sujet et ce ng-repeat n'par défaut, c'est gâcher les choses.
- J'ai ajouté un lien vers le angular js docs qui explique le problème.
- Je l'ai essayé, mais value="{{entry.name}}" et {{entry.name}} jeu m'des chaînes vides. Il n'y a pas de valeur à l'intérieur d'eux.
- piste n'était pas la solution ici, parce que j'din ont pas de doublons dans les données JSON. L'erreur que je faisais quand j'étais en appelant le service était que j'étais emballage de la réponse JSON dans une fonction de rappel qui, tout en parcourant les $scope.entries a été à l'origine du problème et de me donner undefined pour console.log(data.entries);. Merci:)
- ok je viens de passer par le message d'erreur signalé dans la console.
InformationsquelleAutor Malcr001
7

Si je peut ajouter une autre raison pour laquelle cela peut se produire...

Si vous faites cela avec un JS object [] ou {}

et vous êtes de passage dans une directive comme ce
```
<my-directive my-attribute="{{ myObject }}"></my-directive>
```
À l'intérieur de la directive, vous devez l'activer myObject de retour dans un objet en faisant cela,
```
...
controller: function( $scope ){

  $scope.links = $scope.$eval( $scope.myObject );
....
```
Puis le HTML et ng-repeat travaillera
```
...
<span class="" ng-repeat="link in links">
...
```
ngRepeat ne sais pas comment répéter au cours d'une seule chaîne.

Voici ce que l'objet pourrait ressembler avant de $scope.$eval
```
"[{ hello: 'you' }]"
```
et après $scope.$eval()
```
[{ hello: 'you' }] an actual object to repeat over.
```
L'erreur type d'une référence qu'il ne peut pas répéter d'une chaîne. Voici l'erreur que j'ai eu.

Erreur: [ngRepeat:dupes] http://errors.angularjs.org/1.3.0-beta.8/ngRepeat/dupes?p0=link%20in%20links&p1=chaîne de caractères%3Al
- Cela a résolu mon problème que j'ai passé des heures sur. merci
- Juste ce dont j'avais besoin merci 🙂
InformationsquelleAutor SoEzPz
1

Il semble que vous avez un problème avec la structure des données dans votre périmètre. Votre exemple JSON montre un objet avec un entries de la propriété et un count de la propriété. Vous mettez ensuite que l'objet entier à votre portée entries. Cela signifie que vous auriez besoin pour accéder aux entrées entries.entries, avec le comte entries.count. Peut-être que ce contrôleur est plus proche de ce que tu voulais:
```
myApp.controller("MyController", ['$scope', '$http', '$log', function($scope, $http, $log){
    ...

    $http.get('https://myServiceURL').success(function(data){
        $scope.entries = data.entries;
        $scope.count = data.count;
    });
}]);
```
- Regardant de plus près, ce n'est pas vraiment expliquer l'erreur comme donné, car il serait fastidieux d'effectuer une itération sur les chaînes de caractères "entrées" et "count"; je pense qu'il y a peut être quelque chose d'autre se passe ici ce n'est pas évident dans les exemples donnés, puisque vous aurez uniquement besoin track by si votre tableau est d'un type primitif comme string.
- C'est aussi ce que je propose, mais j'ai réalisé qu'il n'est pas vraiment lié à son erreur. Il vient de correctifs de l'exemple, comme c'est.
- et @Goodzilla: Oui, la journalisation data.entries et data.count sont à la fois de me donner undefined comme résultat.
- Oui, c'est exact. L'erreur que je faisais quand j'étais en appelant le service était que j'étais emballage de la réponse JSON dans une fonction de rappel qui, tout en parcourant les $scope.entries a été à l'origine du problème et de me donner undefined pour console.log(data.entries);. Je pourrais accepter qu'une seule réponse, et parce que Goodzilla pensé à elle d'abord, j'ai accepté sa réponse. Veuillez ne me dérange pas. Vous avez été tout aussi utile. Merci 🙂
InformationsquelleAutor Martin Atkins
-1

//Pour permettre à ce Service Web pour être appelé à partir d'un script, à l'aide de ASP.NET AJAX,décommentez la ligne suivante.

[Système.Web.Script.Services.ScriptService] ==> Décommentez cette ligne Si vous utilisez .NET Service

InformationsquelleAutor Duc Tran Minh

-1

doublons dans ng-repeat n'est pas autorisé .
Exemple

    <!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>

Pourriez vous s'il vous plaît concerner votre réponse - maintenant, il y a un an après le débat a fait place à l'origine - à l'autre, a accepté de répondre. Pourquoi il ajoute de la valeur et si peut-être "le monde a changé" et probablement la accepté de répondre ne fonctionne plus, ou quelque chose le long de ces lignes. Merci.

InformationsquelleAutor Yogesh Sharma

Vous devez vous connecter pour publier un commentaire.