在輸入最少3個字符後製作Ng2選擇顯示列表

Question

我需要ng2-select給我一個能夠輸入和過濾清單的項目列表，一個自動完成功能。

問題是我的列表太大（+1000項），所以我的想法是隻有在輸入最少3個字符後才顯示它，以便減少列表。

如果有一個更輕的自動完成字段，我也爲他們開放。

Answer 1

有ng2-auto-complete組件，您可以使用npm進行安裝。然後，您可以配置爲使用

最小字符，數量，當源是遠程的數據，

Answer 2

你可以設置你的項目是空的，直到字符的數量看下拉列表符合您的條件（3個字符）。 所以你有這樣的事情：

completeItems: Array<string> = []; //your 1k+ list 
items: Array<string> = []; //reduced list of items to show 

public search(searchString: string) { 
    if(searchString.length>2){ //3 character minimum 
     this.items = this.completeItems; 
    } 
    else{ 
     this.items = []; 
    } 
} 

和你的NG-選擇：

<ng-select 
    [items]="items" 
    (typed)="search($event)" 
    (data)="refreshValue($event)" 
    (selected)="selected($event)" 
    (removed)="removed($event)"> 
</ng-select> 

有一些問題，刪除字符的時候，卻是後話。