[英]Bootstrap ui angularjs with filter issue
I am using Bootstrap UI in my angular application. 我在角度应用程序中使用Bootstrap UI 。 I have a tooltip in the html page which works fine.
我在html页面中有一个工具提示,工作正常。 I noticed that after the tooltip is displayed and I move my mouse out, the Ui-bootstrap-tpls.js fires a method called "hideTooltipBind" which in turn calls $apply and it triggers the filters in that scope to reload.
我注意到在显示工具提示并移出鼠标后,Ui-bootstrap-tpls.js会触发一个名为“hideTooltipBind”的方法,该方法又调用$ apply,它会触发该范围内的过滤器重新加载。
Lets say I have 10 filters in the scope which is filtering an array of 100 each. 假设我在范围内有10个过滤器,每个过滤器都有100个过滤器。 Everytime a tooltip is displayed, all my filters are forced to reload again.
每次显示工具提示时,都会强制我的所有过滤器重新加载。 How can I avoid this?
我怎么能避免这个? I am using
我在用
//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js
jquery-2.0.3.js
ui-bootstrap-tpls-0.11.0.js
I have attached the screenshot of the Call Stack 我附上了调用堆栈的屏幕截图
You can utilise some form of one-time binding. 您可以使用某种形式的一次性绑定。 There are multiple options out there:
有多种选择:
There are some differences to the four (unrelated to your question at hand however): 这四个方面存在一些差异(但与您手头的问题无关):
bindonce
and bo-*
). bindonce
和bo-*
)。 Assuming you'd start leveraging either one of them, your bindings could look something like this: 假设你开始利用其中任何一个,你的绑定看起来像这样:
<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>
This way, your filters would not reevaluate on Angular calls to $digest
. 这样,您的过滤器就不会重新评估对
$digest
Angular调用。 If you are filtering a collection in your view ( <li ng-repeat="coll | filter"></div>
), I'd suggest you move those filters to the controller to reduce the amount of calls to the filters themselves. 如果您要在视图中过滤集合(
<li ng-repeat="coll | filter"></div>
),我建议您将这些过滤器移动到控制器以减少对过滤器本身的调用量。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.