javascript - 使用 angular 在 overflow-x auto 上停止自动滚动

Question

我有一个使用 $scope.items.unshift(item) 的套接字事件到列表的顶部。

html 正在使用 <ol ng-repeat="item in items"><li>{{item.name}}</li></ol>

问题是无论何时出现一个元素，如果用户在列表上向下滚动

ol { overflow-y: auto; max-height: 100px; }

然后滚动位置发生变化，如果他们正在阅读一个元素的一半，它就会跳出 View 或在页面上向下跳一点。

我正在尝试能够动态地将元素添加到列表中，但不移动滚动条...这样即使元素流入列表顶部，当前滚动位置也是粘性的。

Answer 1

我建议您在取消移动时从 scrollTop 添加元素的高度。获取您的列表元素 myList 并执行以下操作:

var currentScrollTop = myList.scrollTop(),
itemHeight= 30;
$scope.items.unshift(item)
myList.scrollTop(currentScrollTop + itemHeight);

我没有测试这段代码，但它应该给你一个想法。