Estoy tratando de crear un HTML textarea para cada miembro de una matriz, pero no está representando. He leído los documentos de AngularJS y he probado varios track by Expresiones en vano.
La condición de error surge si el usuario ingresa el mismo texto en múltiples textareas. Parece que Angular está utilizando el valor del área de texto como una clave única. Podría piratear esto agregando y eliminando un identificador arbitrario antes del texto, pero parece poco convincente.
Para que quede claro, el mensaje de texto es que el problema se produce después de que el usuario haga clic en enviar (solo en javascript: no hay viaje de ida y vuelta al servidor) y, a continuación, el código siguiente representa lo que el usuario escribió.
Gracias por adelantado.
El error específico que recibo es:
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
El HTML es:
<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>
La segunda etapa de HTML es:
<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>
El JSON subyacente es:
"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?"
]
Respuestas
5 para la respuesta № 1Cambiar o agregar track by parte a su ng-repetir
o bien usar by $index o by openEndedQuestion
<tr ng-repeat="oeq in openEndedQuestions track by oeq">
o
<tr ng-repeat="oeq in openEndedQuestions track by $index">
Mejor usar segundo caso
También como regla general, trate de no unirse a primitivas en angular (es decir, cadenas y números). Mejor solución podría haber sido:
en el controlador:
$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?"}
]
y en la plantilla:
<tr ng-repeat="q in questions track by q.id">
Ver jsfiddle: http://jsfiddle.net/vittore/V5n4t/