5

我遇到了一种情况，我必须从 ng-repeat 表达式中更新范围变量（实际上是 ng-repeat 中的 ng-class 调用）。

<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>

在 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 在子控制器中，我要更新的数据在其父控制器中。我知道您已经多次阅读相同的问题，请继续阅读并查看JsFiddle示例。

因此，表达式函数检查该特定 ng-repeat 迭代的过滤数据，如果它与其他一些相应的父范围变量不匹配，它会返回一个类，但它也应该更新父范围计数器。由于这些表达式不只计算一次，而是至少计算一次（由于摘要中的脏检查），它会导致计数器在每种情况下都增加一次以上。

我已经通过在 ng-repeat 之后计算应用于该特定数据的类来解决我的问题（您将在JsFiddle示例中看到）。但是我想我将来可能会遇到同样的问题，所以我想学习如何在 ng-repeat 迭代的表达式中更新父范围。

我已经放了第二个JsFiddle，我尝试在父控制器和子控制器上使用工厂，希望更新两个控制器的公共变量。当我记录（consol.log）每个迭代和工厂方法变量时，它显示迭代时间 + 1（仍然是错误值），但它没有反映在页面表达式上......根本没有意义。

我会很感激任何帮助。谢谢。

JsFiddle 1 JsFiddle 2

4

1 回答 1

1

ng-class由于监视的表达式（如指令隐式设置的表达式）“每个$digest()可以执行多次，并且应该是幂等的”。您应该了解$watch()和$digest()函数的作用，并寻找有关Angular 的摘要循环的资源。

因此，在 watchExpression 中增加一个计数器并不是一个好主意。
不过，计数课程似乎还可以。

顺便说一句，工厂方法将帮助您跨范围共享数据，但对“每个摘要周期多次执行”问题没有帮助。此外，在您的情况下它可能是多余的，因为子范围和父范围可以直接共享数据。
在任何情况下，要显示结果，您必须将工厂的getMismatchCount()函数与getMismatchCount()您在 HTML 中使用的函数“绑定”（in Mismatches Count from Factory: {{getMismatchCount()}}）：

function mainCtrl($scope, $window, repeatFactory)
    ...
    $scope.getMismatchCount = repeatFactory.getMismatchCount;
于 2014-03-22T18:08:11.643 回答