Sto cercando di creare un HTML textarea per ogni membro di un array ma non è il rendering. Ho letto i documenti di AngularJS e ho provato vari track by espressioni inutilmente.
La condizione di errore si verifica se l'utente immette lo stesso testo in più textareas. Sembra che Angular stia utilizzando il valore dell'area di testo come una chiave univoca. Potrei hackerarlo aggiungendo e rimuovendo un identificatore arbitrario prima del testo, ma questo sembra zoppo.
Per essere chiari, il problema è visualizzato dopo che l'utente fa clic su invio (solo javascript - nessun round trip sul server) e quindi il codice successivo rende ciò che l'utente ha digitato.
Grazie in anticipo.
L'errore specifico che ottengo è:
Duplicates in a repeater are not allowed.
Use "track by" expression to specify unique keys.
Repeater: openEndedQuestion in openEndedQuestions track by openEndedQuestion.id,
Duplicate key: undefined
L'HTML è:
<tr ng-repeat="openEndedQuestion in openEndedQuestions">
<td width="375" style="font-size: 18px;">
<b>{{openEndedQuestion}}</b><br>
<textarea id="openEndedAnswer_{{$index}}" cols="80"></textarea>
</td>
</tr>
L'HTML della seconda fase è:
<tr ng-repeat="openEndedAnswer in openEndedAnswers">
<td width="375" style="font-size: 18px;">
<b>{{openEndedAnswer}}</b>
</td>
<td width="225">
<span style="font-size: 35px; padding: 2px; color: #468847;"
ng-repeat="starIndex in [0, 1, 2, 3, 4]"
ng-click="povStarTracker.setStarRating($parent.$index, starIndex + 1)"
ng-class="povStarTracker.getClassForStar($parent.$index, starIndex)"></span>
</td>
</tr>
Il JSON sottostante è:
"openEndedQuestions" : [
"Do you think the coach is being fair?",
"Should the coach give all of his players a chance to play in the games?",
"Should Austin say anything about this to his coach?",
"What could Ryan say to Austin?"
]
risposte:
5 per risposta № 1Cambia o aggiungi track by parte alla tua ng-repeat
o usare by $index o by openEndedQuestion
<tr ng-repeat="oeq in openEndedQuestions track by oeq">
o
<tr ng-repeat="oeq in openEndedQuestions track by $index">
Meglio usare il secondo caso
Inoltre, come regola generale, cerca di non legare i primitivi in angolari (cioè stringhe e numeri). La soluzione migliore avrebbe potuto essere:
nel controller:
$scope.questions = [
{id:1, text: "Do you think the coach is being fair?"},
{id:2, text: "Should the coach give all of his players a chance to play in the games?"},
{id:3, text: "Should Austin say anything about this to his coach?"},
{id:4, text: "What could Ryan say to Austin?"}
]
e nel modello:
<tr ng-repeat="q in questions track by q.id">
Vedi jsfiddle: http://jsfiddle.net/vittore/V5n4t/