infinite-scroll.js

infinite-scroll.js

(function() {
    'use strict';

    angular.module('app').directive('infiniteScroll', ['$window', function(window) {
        return {
            restrict: 'A',
            link: function(scope, element, attributes) {
                angular.element(window).bind('scroll', function () {
                    var container = window.document.body;
                    if((window.innerHeight + window.scrollY) >= window.document.body.offsetHeight) {
                        scope.$apply(attributes.infiniteScroll);
                    }
                });

                // If you want to have the element have it's own scroll bar, set height and overflow:auto, use below.
                /*var container = element[0];

                element.bind('scroll', function() {
                    if (container.scrollTop + container.offsetHeight >= container.scrollHeight) {
                        scope.$apply(attributes.infiniteScroll);
                    }
                });*/
            }
        };
    }])
}());