首页 文章

angularJS ng-dropdown-multiselect实现无限滚动的滚动事件

提问于
浏览 次
1

我使用AngularJS和bootstrap创建了一个多选下拉列表，并添加了搜索和可滚动选项，它工作正常 . 我需要在多选下拉滚动栏中滚动时实现无限滚动 . 它不适用于多选下拉菜单，但无限滚动适用于div . 我看到onItemSelect和onItemDeselect的事件没有找到任何滚动多选下拉列表的事件 .

我包括以下代码：

<div  ng-dropdown-multiselect=""  options="user" selected-model="userModel" extra-settings="example14settings" when-scrolled="loadMore()"></div>

$scope.example14settings = {
    scrollableHeight: '100px',
    scrollable: true,
    enableSearch: true
};

$http.get('user').success(function(response){
//users list has huge data need to implemented infinite scroll
          $scope.userList = response;
          $scope.users = $scope.userList.slice(0,10);
});
 $scope.loadMore = function (){
       $scope.user = $scope.users.slice(0, $scope.user.length + 8);
 };

下面是工作无限滚动代码外部div不在mutlselect下拉列表中也搜索后它没有为下一个数据集做无限滚动 .

码：

<div   id="fixed" ng-dropdown-multiselect=""  options="user"
       selected-model="userModel"
       extra-settings="example14settings" when-scrolled="loadMore()"></div>

#fixed {
 height: 400px;
 overflow : auto;
}
$scope.example14settings = {
    enableSearch: true
};

angular.module('App').directive('whenScrolled', function() {
    return function(scope, elm, attr) {
        var raw = elm[0];

        elm.bind('scroll', function() {
            if (raw.scrollTop + raw.offsetHeight >= raw.scrollHeight) {
                scope.$apply(attr.whenScrolled);
            }
        });
    };
});

如何在滚动内添加无限滚动以进行角度多选下拉？此外，当用户搜索某些内容时，无限滚动应该在向下滚动时对搜索到的数据起作用？

java html css angularjs

1 回答

  • 0

    根据您在此处发布的内容，我可以看到您没有应用“loadMore（）”函数（但这可能不是您唯一的问题） . 试试这个：

    angular.module('App').directive('whenScrolled', function() {
    return function(scope, elm, attr) {
        var raw = elm[0];

        elm.bind('scroll', function() {
            if (raw.scrollTop + raw.offsetHeight >= raw.scrollHeight) {
                scope.$apply('loadMore()');
            }
        });
    };
});

    尝试使用这样的“ng-dropdown-multiselect”：

    <ng-dropdown-multiselect when-scrolled="loadMore()"></ng-dropdown-multiselect>"

    您需要绑定到元素而不是属性 .

    回复于

相关问题