カスタマイズしたドロップダウンでオートコンプリートを取得するには？

Question

私はオートコンプリート用のカスタマイズされたドロップダウンを実装する必要がありますが、私はそれを得ることができません。ここではng-changeで応答を得ています。しかし問題は、最初の3文字を入力してオートコンプリートを取得する方法で、キーボードのキーを使用してドロップダウンを移動する必要があります。

はJavaScript：

$scope.fnAutocompleteQuestion = function (question) { 
     $scope.data = [ 
     { "val": 1, "txt": "one" }, 
     { "val": 2, "txt": "two" }, 
     { "val": 3, "txt": "three" }, 
     { "val": 4, "txt": "four" }, 
     { "val": 5, "txt": "five" }]; 
     console.log($scope.data); 
    }; 

HTML：

 <div class="input-group dropdown" ng-class="{'open': mydropdownQues}"> 
     <input type="text" class="form-control" ng-model="input.question" 
    data-toggle="dropdown" aria-describedby="basic-addon2" ng-change="fnAutocompleteQuestion(input.question);mydropdownQues=!mydropdownQues"> 
    <div class="dropdown-menu width-menu"> 
      <ul class="ul-scroll"> 
       <li ng-repeat="value in data " ng-click="input.question=value.txt"> 
        {{value.txt}} 
        <hr ng-show="!$last"> 
       </li> 
      </ul> 
     </div> 
    </div> 

Answer 1

あなただけinput.questionは、検索テキストのng-modelあるごng-repeatでfilter: input.questionを追加する必要があります。このような何か：

<li ng-repeat="value in data | filter: input.question" ng-click="input.question=value.txt"> 
    {{value.txt}} 
    <hr ng-show="!$last"> 
</li> 

working example