angularjs范围函数比调用更频繁地触发

Question

我有一个范围函数，它触发的次数比调用的次数多，并且无法找出原因。我在plunker中创建了一个小例子，下面显示了片段。当页面加载时，您会认为$ scope.hex_color应该触发三次，但如果您在调试器（Chrome F12）中查看控制台，则会触发九次。

任何人都可以解释一下吗？

http://plnkr.co/edit/7DMwA2InP0v6sD2s5WxW?p=preview

html片段：

<div ng-repeat="shape in list">
    <div>{{ shape.Title }} | {{ hex_color(shape) }}</div>
</div>

控制器代码段：

$scope.list = [
    { "Id": 1000, "Title": "Red Ball", "red": "ff", "green": "00", "blue": "00" },
    { "Id": 1001, "Title": "Green Triangle", "red": "00", "green": "ff", "blue": "00" },
    { "Id": 1002, "Title": "Blue Square", "red": "00", "green": "00", "blue": "ff" },
];
$scope.hex_color = function (shape) {
    $log.info("hex_color: " + shape.Id);
    return "#" + shape.red + shape.green + shape.blue;
}

更新：如果我在本地服务器上运行代码（上面的例子是监控plunker中的代码），它会触发15次！

Answer 1

据我所知，在每个$ digest期间执行一次过滤器。当您考虑AngularJS如何管理其数据绑定时，这是有道理的。由于AngularJS使用脏检查，因此必须在＆＃34;你＆＃34;之后重新检查它的所有内部$ watch（）语句。 （作为程序员/用户）做任何事情。毕竟，用户进行的每次交互都可能导致视图模型发生变化，进而可能会改变正在过滤的集合。因此，必须在每个$ digest的末尾重新应用过滤器。

来源： - http://www.bennadel.com/blog/2489-how-often-do-filters-execute-in-angularjs.htm