Angularjs - 过滤时显示的东西很慢 [英] Angularjs - display something when filtering is slow
问题描述
在角我有一张桌子和一个搜索框，用户可以键入和角度将数据之间的搜索和显示表。问题是，我有足够的数据过滤可以得到减缓，在这种情况下，我想显示一个微调：
In angular I have a table and a search box where user can type and angular will search among the data and display a table. The problem is that I have enough data that filtering can get slowed down, in this case, I would like to display a spinner:
类似于我的HTML样本：
Sample similar to my html:
<body ng-controller="MainCtrl">
Search: <input ng-model="searchText">
<table id="searchTextResults">
<tr><th>Name</th><th>Phone</th><th>Address</th><th>City</th><th>Zip</th><th>Country</th></tr>
<tr ng-repeat="friend in friends | filter:searchText">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
<td>{{friend.address}}</td>
<td>{{friend.city}}</td>
<td>{{friend.zip}}</td>
<td>{{friend.country}}</td>
</tr>
</table>
<div class='myspinner' > <!-- display only if filtering is occurring -->
现在的问题是，我怎么能每次都显示一个微调的滤波发生？
The question is, how can I display a spinner each time that filtering is occurring?
CSS的微调DIV：
CSS for spinner div:
.myspinner {
position: absolute;
left: 45%;
top: 45%;
height:50px;
width:50px;
margin:0px auto;
position: absolute;
-webkit-animation: rotation .6s infinite linear;
-moz-animation: rotation .6s infinite linear;
-o-animation: rotation .6s infinite linear;
animation: rotation .6s infinite linear;
border-left:6px solid rgba(0,170,240,.25);
border-left: 6px solid rgba(0,170,240,.25);
border-right: 6px solid rgba(0,170,240,.25);
border-bottom: 6px solid rgba(0,170,240,.25);
border-top: 6px solid rgba(0,170,240,.6);
border-radius:100%;
}
链接plunkr：<一href=\"http://plnkr.co/edit/NcbPPcxL1rk0ZBKpbqZG?p=$p$pview\">http://plnkr.co/edit/NcbPPcxL1rk0ZBKpbqZG?p=$p$pview
推荐答案
您可能还需要创建自己的指令，用于过滤的信息，默认的NG-过滤器是缓慢的，因为它会检查通过你的对象的所有字段。
you might also need to create your own directive for filtering the information, the default ng-filter is slow because it checks through all the fields on your objects.
您可以用于过滤到特定的字段，创建一个自定义NG-指令看看
you can create a custom ng-directive for filtering into your specific fields, take a look
这篇关于Angularjs - 过滤时显示的东西很慢的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
