我的加载更多功能适用于按钮单击,但它不适用于滚动

My load more function is working on button click, but it doesn't work on scrolling

本文关键字:适用于 不适用 滚动 按钮 加载 多功能 我的 单击      更新时间:2023-09-26

下面的代码适用于按钮ng-click

$scope.loadMore = function() {
    var container = $('ul.notification-popup-scroll');                
    $scope.totalDisplayed += 4;
    $scope.notifications = notifications.data.notification;
});

但是,如果我尝试做这样的事情,则范围变量不起作用。

$('ul.notification-popup-scroll').scroll(function() {
    var container = $('ul.notification-popup-scroll');
    if (container.scrollTop() > 500) {
        $scope.totalDisplayed += 4;
        $scope.notifications = notifications.data.notification;
    }
});

我正在尝试让无限滚动工作,但我只想从已经获取的对象加载数据。我不是每次都做一个http请求。

已更新

使用角度视图指令。

我认为这对您来说是最好的解决方案:

<body in-view-container>
   <!-- your items rendered here -->
   <div in-view="$inview && loadMore()"></div>
</body>

试试这个方式:

$scope.$apply(function () {
    $scope.totalDisplayed += 4;
    $scope.notifications = notifications.data.notification;
});

$scope.$apply告诉 angular 有些事情发生了变化。