Question

首先抱歉我的英语。我的问题是：

我有这个简单的代码：

<li ng:repeat="item in menu.items" ng:class="getMenuItemClass(item)"> 
<a ng:href="#{{item.url}}">{{item.label}}</a>
</li>

这是我的getMenuItemClass：

scope.getMenuItemClass = function(item) {
   console.log(item)
   var hashPath = $location.hashPath || '/';
   if (hashPath === item.url) {
      return 'selected';
   }
   return '';
};

这是准备好的例子，我不知道为什么，但在我的实际应用中它一式三份！：0 如果我犯了错误，有人可以向我解释一下吗？

http://jsfiddle.net/h7yKr/44/

我已经将jsfddle更新为最新版本的angular，现在它已经四倍了！看它 http://jsfiddle.net/h7yKr/46/

编辑澄清：问题是getMenuItemClass（）被召唤的次数要多得多，尝试打开jsfiddle并打开浏览器控制台并观看console.log！

Answer 1

Angular可以在digest周期内多次计算表达式，因此一次又一次地执行函数。

正如documentation此处

中所述

Angular进入$ digest循环。循环由两个较小的组成处理$ evalAsync队列和$ watch列表的循环。 $ digest 循环不断迭代，直到模型稳定，这意味着 $ evalAsync队列为空，$ watch列表未检测到任何队列变化。

由于$ watch表达式是一个函数，因此可以多次调用它。

或者查看$route服务中的$routeChangeStart个事件。您可以订阅此活动。在您的范围上创建一个变量，并对该变量进行ng-class绑定

angular：ng-class in ng-repeat，重复调用

1 个答案: