Wie Paginierung in Auswahlbox tun scroll basierend auf

Question

HTML

<select class="form-control choice requiredField" id-available name="SelectData" ng-model="box.box_id" title="Select"> 
    <option value="" disabled selected>{{'_SELECT_BEACON_' | i18n}}</option> 
    <option value="{{y.box_id}}" ng-repeat="y in dataList" class="nms">{{y.beacon_code}}</option> 
</select> 

AngularJS

boxService.listUnassignedDevice(function(res) { 
    $scope.dataList = res; 
}, function(error) { 
}); 

Hier habe ich große Daten in "Datalist" (10000>). Also muss ich die Daten im Auswahlfeld auflisten, nachdem die Maus runterscrollt. Zuerst muss ich 100 Daten anzeigen, wenn die Maus nach unten scrollt, muss ich die nächsten 100 Daten von der API anzeigen.

Answer 1

Sie können ngInfiniteScroll Direktive verwenden und Skript-Tag hinzufügen, dann Modul 'infinite-scroll' hinzufügen und dann verwenden Sie die Direktive, indem Sie ein infinite-scroll-Attribut für ein Element angeben.

<div infinite-scroll="myPagingFunction()" infinite-scroll-distance="3"></div> 

ngInfiniteScroll rufen myPagingFunction() jederzeit den Boden das Element nähert sich dem unteren Rand des Browserfensters. Weitere Informationen dazu, welche Attribute verfügbar sind, finden Sie in der API-Dokumentation zur Verwendung, und werfen Sie einen Blick auf die Demos, um ngInfiniteScroll in Aktion zu sehen.