javascript 如何使用angular js滚动div的底部
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25347852/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to scroll bottom of div using angular js
提问by Shruti
I have a div in which I added element .I want to scroll to bottom of the div whenever element added in div.I know how to do in in jquery .But I did not know how to scroll using angular js I know using jquery Scroll to bottom of div?
我有一个 div，我在其中添加了元素。每当在 div 中添加元素时，我都想滚动到 div 的底部。我知道如何在 jquery 中进行操作。但我不知道如何使用 angular js 滚动我知道使用 jquery Scroll到div的底部？
testCaseContainer is id of div .
testCaseContainer 是 div 的 id。
var elem = document.getElementById('testCaseContainer'); // just to
// scroll down
// the line
elem.scrollTop = elem.scrollHeight;
I want to know how it is possible using angular ?
我想知道如何使用 angular ？
http://plnkr.co/edit/M8tCL8Szc3h3FatFLycG?p=preview
http://plnkr.co/edit/M8tCL8Szc3h3FatFLycG?p=preview
I added css in div container so that it scroll .
我在 div 容器中添加了 css 以便它滚动。
.heightClass{
height:100px;
overflow :auto;
}
how to move focus below when item is added ..please post your answer..
添加项目时如何在下方移动焦点..请发布您的答案..
回答by pixelbits
You could create your own scroll directive that watches a collection, and when it changes, sets the scroll position:
您可以创建自己的滚动指令来监视集合，并在它更改时设置滚动位置：
app.directive('scroll', function($timeout) {
return {
restrict: 'A',
link: function(scope, element, attr) {
scope.$watchCollection(attr.scroll, function(newVal) {
$timeout(function() {
element[0].scrollTop = element[0].scrollHeight;
});
});
}
}
});
HTML
HTML
<div class="heightClass" scroll="studentDetail">
Note: $timeout is needed to ensure that the scroll position is set after the view is rendered.
注意：需要 $timeout 来确保在视图渲染后设置滚动位置。
