DEMO
使用ng-repeat渲染对象列表。假设这个列表很长，用户滚动到底部看到一些对象。
当用户观察对象时，一个新项目被添加到列表的顶部。这导致观察到的对象改变其位置，即，用户突然在被观察对象的相同位置处看到别的东西。
在添加新项目时，如何保持观察对象在同一位置？
它可能解决相当优雅，通过使用scrollTop属性的div。我使用两个指令 – 一个处理包装元素的滚动位置，其他注册新元素。
如果有什么不清楚，给我一个呼喊。
原文链接：https://www.f2er.com/angularjs/145374.html如果有什么不清楚，给我一个呼喊。
JS：
.directive("keepScroll",function(){
return {
controller : function($scope){
var element = null;
this.setElement = function(el){
element = el;
}
this.addItem = function(item){
console.log("Adding item",item,item.clientHeight);
element.scrollTop = (element.scrollTop+item.clientHeight+1);
//1px for margin from your css (surely it would be possible
// to make it more generic,rather then hard-coding the value)
};
},link : function(scope,el,attr,ctrl) {
ctrl.setElement(el[0]);
}
};
})
.directive("scrollItem",function(){
return{
require : "^keepScroll",att,scrCtrl){
scrCtrl.addItem(el[0]);
}
}
})
HTML：
<div class="wrapper" keep-scroll>
<div class="item" scroll-item ng-repeat="item in items | orderBy: '-id'">
{{ item.name }}
</div>
</div>
