データリストの値を制限する - AngularJS

Question

AngularJSのDataListを使用して（API呼び出しを介して）約2000の値をレンダリングしようとしています。問題は、これらの値がページを非常に遅くすることです。一度に10個のアイテムしかレンダリングできない方法はありますか？そのデータリストから、入力すると一致する結果が10個まで表示される可能性があります。 https://codepen.io/anon/pen/KyEXMr

<main ng-app="myApp"> 
    <section ng-controller="dataListController"> 
    <form name="some"> 
     <label> Search 
    <input type="text" list="dataList"> 
     </label> 
     <datalist id="dataList"> 
     <option ng-repeat="v in names" value="{{v.eyeColor}}">Age {{v.age}}</option> 
     </datalist> 
    </form> 
    </section> 
</main> 

Answer 1

あなたはオプション属性にng-if="$index < 10"を追加することができます。

は、ここに私のcodepenです。これにより、インデックスが10未満のアイテムのみがレンダリングされ、テキストフィルタは引き続き適用されます。 LimitToは、その中に10個のアイテムだけを含む新しい配列を返します。これにより、テキストフィルタはアイテムを見つけられません。