angularjs – ui-select多重选择在显示选项上非常慢

前端之家收集整理的这篇文章主要介绍了angularjs – ui-select多重选择在显示选项上非常慢前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我遇到这个问题,我不知道如何解决它.我在我的网页上使用了 ui-select multiselect.首先,将http.get请求发送到获取数据的URL,然后填充ui-select选项.数据较大 – 数据长度为2100.该数据将显示为选项. (在页面加载期间的开始处获取数据并存储在数组中)

但问题是每次我点击多重选择来选择一个选择,需要4-5秒钟来填充列表,页面变得非常慢.我该如何减少这个时间?

选择数据存储在数组中,数据类型是字符串数组.

  1. <ui-select multiple ng-model="selectedFields.name" style="width: 100%;">
  2. <ui-select-match placeholder="Select fields...">{{$item}}</ui-select-match>
  3. <ui-select-choices repeat="fields in availableFields | filter:$select.search">
  4. {{fields}}
  5. </ui-select-choices>
  6. </ui-select>

在控制器中,

  1. $scope.selectedFields = {};
  2. $scope.selectedFields.name = [];
  3.  
  4. $scope.init = function() {
  5.  
  6. $http.get(url)
  7. .success( function(response,status,headers,config) {
  8. availableFields = response;
  9. })
  10. .error( function(err) {
  11. });
  12. };
  13.  
  14. $scope.init();

如果不是这样,有没有任何其他选择/选择我可以使用哪个不延迟显示选择选择?

这是ui-select中的已知问题.我尝试了以下几种方式,两者都可以

1)有一个解决方法 – 使用

  1. | limitTo: 100

这将选择显示限制为100,但可以选择所有选项.查看this thread了解更多详情.

2)由于某些时候,需要在选择中显示整个列表,1)不是一个可行的选择.我使用了一个不同的库 – selectize.js.这是一个plunker演示在页面中给出

猜你在找的Angularjs相关文章