Javascript 避免对Angular.js中的绑定值进行不必要的计算

具有一个angular.js指令，该指令呈现为表格。大多数情况下，表很小，因此性能不是问题

但有时，该表有许多行，例如数千行，因此渲染每一行的成本很高，因为每个绑定值似乎要求值两次，并且有很多绑定值。Angular似乎对这个表进行了很多评估，结果发现表中的所有值都没有变化，因此不需要重新提交，从而不必要地瘫痪了应用程序

例如，当mouseenter/mouseleave上$scope.showMenu的值更改时，整个表似乎要重新估价

有没有办法告诉Angular，整个表依赖于其他值，比如$scope.checksum，如果这个值不变，那么整个表也不变

<div class="header" ng-mouseenter="showMenu=true" ng-mouseleave="showMenu=false">
   <!-- show dropdown menu only when hovering over the header -->      
   <span ng-if="showMenu" class="menu dropdown" >  ... menu content goes here...</span>

   <h2>{{getTitle()}}</h2> 
   <p>{{description}}</p>
</div>

<table>
   <tr ng-repeat="key in rowKeys">  
      <td title="{{getRowItem(key)|pretty">{{getRowItem(key)|abbreviated}}</td>
      <td>{{getRowValue(key)|number</td>
  </tr>
enter code here
   </tr>
</table>

---

如果您使用的是Angular 1.3，并且表中的数据在其他时刻没有更新，则必须尝试绑定一次

    <tr ng-repeat="key in ::rowKeys">
      <td>{{::key}}</td>
    </tr>

---

另外，ng mouseenter和ng mouseleave生成了更多的$watchers，我建议您在菜单中使用CSS规则来实现这一效果。

我不知道，如果您尝试将每个部分包装在自己的控制器中，以便每个部分都有不同的$scope，这有什么帮助吗？使表成为自己的指令还将创建一个新的$scope。这无疑是更干净的代码，将UI与数据分离。我现在就试试。我从“相关”帖子列表中看到一些关于呈现大型列表的帖子，因此也将限制使用Limito呈现的行数。标记依赖项仍然很好，这样脏检查就不需要计算每个绑定值。在深入研究它之前，我建议考虑对大型angularJS列表进行其他性能改进。这个列表非常棒。加上将其分离，使鼠标盖不会导致重新估价，这正是我所寻找的线索。谢谢你们两位！