嘿,每个人都可以请某人告诉我这里我做错了什么?
我尝试构建一个包装器,其中我的数组中的每个元素都获得一个和一个id
但是当我通过我的真实数组循环时,我只得到文本错误:错误:[ngRepeat:dupes] ...
使用假阵列,我的作品非常完美。
我的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>
我的脚本
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);
});
});
非常感谢你的帮助
答案 0 :(得分:4)
当你从Angular得到关于dupes的错误时,这是因为有重复的键。您可以使用the documentation中的track by
来解决此问题。
尝试将ng-repeat
更改为:
<span ng-repeat="person in persons track by $index" id="{{person}}">
<span ng-repeat="text in textWords track by $index" id="{{text}}">