Question

在我的指令中，我编写了动态分页（延迟加载）的逻辑，每次用户滚动到页面底部时我会向其添加更多元素，这样可以正常工作但我想更改滚动位置之后，但它不起作用。
这是我的代码：

 link: function(scope, element) {

            var usersArea = $(".usersArea");

            usersArea.bind("scroll", function() {

                var scrollHeight = $(this)[0].scrollHeight;
                var scrollTop = $(this)[0].scrollTop;
                var clientHeight = $(this)[0].clientHeight;
                var downloadMore = scrollHeight - scrollTop - clientHeight < 50;

                if (downloadMore) {
                    var childScope = scope.$new();    

                    usersContainer = scope.displayPortion(usersContainer);
                    if (usersContainer) {
                        $compile(usersContainer)(childScope);
                        //This doesn't work !!
                        $(this)[0].scrollTop = 500;
                    }
                }
            });    
}

我尝试使用原生javascript和JQuery更改滚动位置但是没有看上去有效，有什么建议吗？

Answer 1

由于compile不是立即程序，我建议推迟任何具有编译结果的操作。最简单（但不是最好）的方法是使用简单的计时器：

  var elt = $(this)[0];
  var scrollHeight = elt.scrollHeight;
  var scrollTop = elt.scrollTop;
  var clientHeight = elt.clientHeight;
  var downloadMore = scrollHeight - scrollTop - clientHeight < 50;

  if (downloadMore) {
      var childScope = scope.$new();    
      usersContainer = scope.displayPortion(usersContainer);
      if (usersContainer) {
          $compile(usersContainer)(childScope);
          setTimeout(function() {
            elt.scrollTop = 500;
          });
      }
  }

更改角度指令内的滚动顶部不起作用

1 个答案: