Angular 4: раскрывающийся список Binding с огромным набором данных (более 10000 записей) - PullRequest
0 голосов
/ 27 ноября 2018

Я пытаюсь связать раскрывающийся список Angular (Angular 4+) с 10000+ записями, это зависшее приложение, мы не можем выполнить какую-либо другую операцию после этого.

Я просто использую * ngFor,для того же

 <select class="form-control browser-default col-md-12" name="attributeName" [(ngModel)]="attributeName">
      <option *ngFor="let item of typeArray" [ngValue]="item">
                {{item}}
       </option>
  </select>

Я пробовал такие решения, как ng2-auto-complete и ng2-completeter, но когда я начинаю печатать, приложение зависает, потому что данные огромны.Любое другое возможное решение?

1 Ответ

0 голосов
/ 27 ноября 2018

Компонент, который вы использовали, довольно бесполезен.У всех из них обнаружение изменений было установлено по умолчанию, что делало их медленными.Используя подсказку от @RahulSwamynathan, я могу получить ng-select, он использует OpPush в качестве механизма CD, и работает очень быстро.Для тестирования я использовал 26000 UUID, и замедление было незаметным.Но то, что, кажется, заставляет это работать, является параметром virtualScroll, установленным в true.

<ng-select [items]="arrayWithStrings" [virtualScroll]="true" [formControlName]="'name'"></ng-select>

Если вы хотите иметь типизацию, которая идет от компонента, вы должны добавить @import "~@ng-select/ng-select/themes/default.theme.css"; в ваш style.cssфайл.

...