簡単なアイテムリストがあります。アイテムを追加するたびに、アイテムを表示する要素の一番下までスクロールできるようにしたいと考えています。$apply()
関数の最後にフックする方法がないことを理解したので、私の解決策は何ですか?
これは私の問題を説明するためのjsfiddleです。十分な項目を追加した後、ul 要素が一番下までスクロールしません...
簡単なアイテムリストがあります。アイテムを追加するたびに、アイテムを表示する要素の一番下までスクロールできるようにしたいと考えています。$apply()
関数の最後にフックする方法がないことを理解したので、私の解決策は何ですか?
これは私の問題を説明するためのjsfiddleです。十分な項目を追加した後、ul 要素が一番下までスクロールしません...
簡単な作業例 (プラグインやディレクティブは必要ありません)...
.controller('Controller', function($scope, $anchorScroll, $location, $timeout) {
$scope.func = function(data) {
// some data appending here...
$timeout(function() {
$location.hash('end');
$anchorScroll();
})
}
})
私のためにそれを行ったトリックは、アンカースクロールコマンドを でラップすることでした$timeout
。そのようにして、スコープが解決され、ページの最後の要素に自動的にシフトしました。
<ul>
毎回一番下までスクロールするクリック ハンドラーをバインドする単純なディレクティブを作成できます。
myApp.directive("scrollBottom", function(){
return {
link: function(scope, element, attr){
var $id= $("#" + attr.scrollBottom);
$(element).on("click", function(){
$id.scrollTop($id[0].scrollHeight);
});
}
}
});