带过滤器问题的Bootstrap ui angularjs

Question

我在角度应用程序中使用Bootstrap UI 。 我在html页面中有一个工具提示，工作正常。 我注意到在显示工具提示并移出鼠标后，Ui-bootstrap-tpls.js会触发一个名为“hideTooltipBind”的方法，该方法又调用$ apply，它会触发该范围内的过滤器重新加载。

假设我在范围内有10个过滤器，每个过滤器都有100个过滤器。 每次显示工具提示时，都会强制我的所有过滤器重新加载。 我怎么能避免这个？ 我在用

//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js
jquery-2.0.3.js
ui-bootstrap-tpls-0.11.0.js

我附上了调用堆栈的屏幕截图

Answer 1

您可以使用某种形式的一次性绑定。 有多种选择：

• 由pasvaz 绑定一次
• 角度 - 一次由tadeuszwojcik
• abourget 的战士
• 快速绑定我（从Karl Seamons工作分叉）

这四个方面存在一些差异（但与您手头的问题无关）：

• bind-once是最受欢迎的开发者。 需要两个指令来完成这项工作（ bindonce和bo-* ）。
• angular-once是这四个中的极简主义者（不要引用我的话）。
• 手表战士不处理基于承诺的数据。
• fast-bind有一个用于半静态绑定的通知程序系统，使用Angular中的事件总线。

---

假设你开始利用其中任何一个，你的绑定看起来像这样：

<div bindonce="someData">
  <span bo-bind="someData.text | yourFilter"></span>
</div>

---

<span once-text="someData.text | yourFilter"></span>

---

<span set-text="someData.text | yourFilter"></span>

---

<span bind-once="someData.text | yourFilter"></span>

这样，您的过滤器就不会重新评估对$digest Angular调用。 如果您要在视图中过滤集合（ <li ng-repeat="coll | filter"></div> ），我建议您将这些过滤器移动到控制器以减少对过滤器本身的调用量。