如何使用角度js滾動div的底部

Question

我有一個div我在其中添加了元素。我想在div中添加元素時滾動到div的底部。我知道如何在jquery中執行。但我不知道如何使用jquery Scroll使用angular js 滾動div的底部？

testCaseContainer是div的id。

var elem = document.getElementById('testCaseContainer'); // just to
                                                                    // scroll down
                                                                    // the line
        elem.scrollTop = elem.scrollHeight;

我想知道如何使用角度？

http://plnkr.co/edit/M8tCL8Szc3h3FatFLycG?p=preview

我在div容器中添加了css以便滾動。

.heightClass{
  height:100px;
  overflow :auto;
}

如何在添加項目時將焦點移動到下方..請發布您的答案..

Answer 1

您可以創建自己的滾動指令來監視集合，當它發生更改時，設置滾動位置：

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

<div class="heightClass" scroll="studentDetail">

注意：需要$ timeout以確保在呈現視圖后設置滾動位置。

演示Plunker