How to get offsetHeight, scrollHeight in AngularJS

Question

I am creating a directive in which I need three values-

scrollTop
offsetHeight

scrollHeight

projectModule.directive('scroller', function ($window) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
    var rawElement = angular.element($window);
    angular.element($window).bind('scroll', function () {
        var scrollTop = rawElement.scrollTop();
        var offsetHeight = rawElement.offsetHeight;
        var scrollHeight = rawElement.scrollHeight;
        console.log(scrollTop + " ," + offsetHeight + " ," + scrollHeight);
        scope.$apply();
        });
    };
});

I can get scrollTop directly by using rawElement.scrollTop() function, but How to get offsetHeight and scrollHeight of that element?

I want to apply that logic-

if ((rawElement.scrollTop + rawElement.offsetHeight + 5) >= rawElement.scrollHeight) {
    scope.$apply();    //For infinite scrolling
}

Thanks in advance.

dfsq · Accepted Answer · 2014-10-15 06:49:48Z

3

I would try to make use of $document service instead, since you actually need document.body.scrollHeight and document.body.offsetHeight. So

var offsetHeight = $document[0].body.offsetHeight;
var scrollHeight = $document[0].body.scrollHeight;

answered Oct 15, 2014 at 6:49

dfsq

193k26 gold badges244 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

captain_jim1 · Accepted Answer · 2014-10-15 06:38:55Z

1

Can you use getBoundingClientRect if $el is the actual DOM element?

var top = $el.getBoundingClientRect().top;

JSFiddle

You could also try using

$el.prop('offsetTop')

answered Oct 15, 2014 at 6:38

captain_jim1

1,0011 gold badge9 silver badges19 bronze badges

Collectives™ on Stack Overflow

How to get offsetHeight, scrollHeight in AngularJS

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related