AngularJS onScroll directive

onScroll.js

;(function (window, _, $, angular, undefined) {
	var module = angular.module("app");
	module.directive("onScroll", [function () {
		var previousScroll = 0;
		var link = function ($scope, $element, attrs) {
			$element.bind('scroll', function (evt) {
				var currentScroll = $element.scrollTop();
				$scope.$eval(attrs["onScroll"], {$event: evt, $direct: currentScroll > previousScroll ? 1 : -1});
				previousScroll = currentScroll;
			});
		};
		return {
			restrict: "A",
			link: link
		};
	}]);
})(window, _, jQuery, angular);

REDAMD.md

About Directive

Bind on scroll event angular way.

Usage

<div on-scroll="scrollHdlr($direct,$event)">

angular.module("app").controller('ctrl', function ($scope) {
	$scope.scrollHdlr = function ($event, $direct) {
		console.log("Scrolling " + $direct > 1 ? "down" : "up", $event);
	};
});

Not working unless you have jQuery. To access currentScroll without jQuery you need to acess scrollTop as a property not a method i.e. current = $element[0].scrollTop;