usar - let javascript w3schools

¿Cómo actualizar una variable de ámbito primario desde dentro de Expresión de ng?

Question

Me encontré con una situación en la que tuve que actualizar una variable de ámbito desde dentro de una expresión ng-repeat (ng-class call dentro de ng-repeat de hecho).

<div id="page" ng-controller="MainCtrl">
.
<section id="body" ng-init="countMis = {num:0}">
.
<tbody>
<tr ng-repeat="upperCaseLetter in alphabet.specialsUpper" ng-controller="letterController">
<td>{{upperCaseLetter}}</td>
<td>{{filteredLetter=(upperCaseLetter | lowercase)}}</td>
<td>{{alphabet.specialsLower[$index]}}</td>
<td><span ng-class="lowercaseEqual($index,filteredLetter)"></span></td>
</tr>
</tbody>

y en app.js:

function letterController($scope)
{
$scope.lowercaseEqual = function(indx,letter)
{
var returnStr="";
if(letter == $scope.alphabet.specialsLower[indx])
{
returnStr = "glyphicon glyphicon-ok";
}
else
{
$scope.countMis.num = $scope.countMis.num + 1;
returnStr = "glyphicon glyphicon-remove";
}
return returnStr;
};
}

Ng-repeat está en un controlador secundario y los datos que deseo actualizar están en su controlador principal. Sé que has leído la misma pregunta muchas veces, sigue leyendo y observa el ejemplo de JsFiddle .

Así que la función de expresión comprueba los datos filtrados de esa iteración ng-repeat particular, si no coincide con alguna otra variable de ámbito padre correspondiente, devuelve una clase, pero también debe actualizar el contador de alcance principal. Como esas expresiones no se evalúan solo una vez, pero al menos una vez (debido a la comprobación sucia en el resumen) el contador de resultados se incrementa más de una vez para cada caso.

He resuelto mi problema contando las clases aplicadas a esos datos particulares después de ng-repeat (verás en el ejemplo de JsFiddle ). Sin embargo, creo que puedo encontrarme con el mismo problema en el futuro, por lo que quiero aprender a actualizar el alcance padre dentro de una expresión de iteración ng-repeat.

He puesto un segundo JsFiddle , he intentado usar una fábrica tanto en el controlador principal como en el secundario, con la esperanza de actualizar una variable común para ambos controladores. Cuando registro (consol.log) cada iteración y la variable de método de fábrica, muestra los tiempos de iteración + 1 (valor aún falso), pero no se refleja en la expresión de la página ... no tiene ningún sentido.

Agradecería cualquier ayuda. Gracias.

JsFiddle 1 JsFiddle 2

Answer 1

Dado que las expresiones observadas (como la configurada implícitamente por la directiva ng-class ) "pueden ejecutarse varias veces por $ digest () y deben ser idempotentes" . Debe comprender lo que hacen las funciones $ watch () y $ digest () y buscar recursos con respecto al ciclo de resumen de Angular .

Por lo tanto, incrementar un contador dentro de watchExpression no es una buena idea.
Sin embargo, contar clases parece estar bien.

Por cierto, el enfoque de fábrica lo ayudará a compartir datos entre diferentes ámbitos, pero no ayudará con el problema de "múltiples ejecuciones por ciclo de resumen". Además, puede ser redundante en su situación, ya que los ámbitos de los padres y los hijos pueden compartir datos directamente.
En cualquier caso, para que los resultados se muestren, debe "enlazar" la función getMismatchCount() la fábrica con la función getMismatchCount() que utiliza en su HTML (en el Mismatches Count from Factory: {{getMismatchCount()}} ):

function mainCtrl($scope, $window, repeatFactory)
...
$scope.getMismatchCount = repeatFactory.getMismatchCount;