Reputation: 198
Hey everybody can somebody please give me a clue what im doing wrong here?
I trying to build a wrapper where every element in my array gets a and a id
But when i loop thru my real array i only get a error with the text: Error: [ngRepeat:dupes] ...
With a fake array i made it works perfect.
MY HTML:
<div class="translaterBox">
<span ng-repeat="person in persons" id="{{person}}">
{{person + " "}}
</span>
<span ng-repeat="text in textWords" id="{{text}}">
{{text + " "}}
</span>
</div>
MY SCRIPT
var app = angular.module('splitScreenApp', []);
app.controller('splitCtrl', function ($scope, $http) {
$scope.translatetText = "Translate Here";
$http.get("getContent.php")
.then(function (response) {
var content = response.data.content;
$scope.content = content;
function splitContentToWords() {
var text;
for(var i = 0; i <= content.length;i++ ){
if(content[i].text){
var text = content[i].text;
}
return text.split(' ');
}
}
$scope.persons = [
'Jack',
'Jill',
'Tom',
'Harvey'
];
$scope.textWords = splitContentToWords();
console.log($scope.textWords);
console.log($scope.persons);
});
});
Thank you really much for your help
Upvotes: 0
Views: 59
Reputation: 281
When you get an error about dupes from Angular, it is because there are duplicate keys. You can solve this by using track by
as seen in the documentation.
Try changing your ng-repeat
to:
<span ng-repeat="person in persons track by $index" id="{{person}}">
<span ng-repeat="text in textWords track by $index" id="{{text}}">
Upvotes: 4