Question

我有AngularJs客户端应用程序，它使用dirPagination.js的dir-paginate指令在表中显示数据。这是代码

 <input type="text"  ng-change="SomeTask()"   ng-model="vm.searchKeyword" />
<table cellpadding="0" cellspacing="0" border="0" class="display table" 
 id="indicatorsTable">
 <tbody style="border-bottom:1px solid black;">
  <tr dir-paginate="user in vm.Results| filter: vm.searchKeyword:false  
  |orderBy:orderByField:vm.reverseSort| itemsPerPage:30"  current-
   page="vm.current_page"  ng-class-odd="'indicatorTableBgColor'">
    </tr>
    </table>
     <div  class="right col-lg-6">
                                            <dir-pagination-controls 
     style="float:right;" max-size="7" on-page-
     change="vm.onPageChange(this)" boundary-links="true"  template-
     url="./app/indicator/dirPagination.tpl.html">
                                            </dir-pagination-controls>
                                        </div>

Javascript控制器功能

 function GetDataFromBackEnd()
 {
    vm.Results=$http.GetData();
  }

 function SomeTask()
 {
   //do some task
  }

搜索需要花费大量时间，因为每个键输入ng-change函数都被调用。当我在搜索功能中删除一个名字并输入一个新名称时，系统有一个显着的延迟，比如20秒左右，以便赶上我的输入。

即使用ng-repeat替换dir-paginate，性能也没有变化。

SomeTask函数计算分页的pageindex（比如显示100个结果中的1到30个）。即使我们删除了ng-change，也不确定在哪里计算过滤结果集的pageindex。

任何帮助都将受到高度赞赏。

由于

Answer 1

好的，我使用$ filter服务解决了这个问题。我在搜索关键字上添加了$ watch，然后搜索了关键字。

     $scope.$watch('vm.searchKeyword', function (term) {
        if (term != null && term != '') {             
            vm.Results = $filter('filter')(vm.orignalResults, term);
            }

     });

在具有大型数据集的angularjs中，搜索过滤器太慢

1 个答案: