Execute function in controller after scroll event AngularJS

Let's say I have a feed of articles that stack:

<div ng-repeat="article in articles">
  <h1> {{article.title}} </h1>
  <p> {{article.body}} </p>
</div>

When scrolling past each article:

<div scroll="atNewArticle(article)" ng-repeat="article in articles">
  ...
</div>

I want to execute a function:

.controller('AppCtrl', ['$scope', function($scope) {
  $scope.atNewArticle = function(){
    console.log(article);
  }
}])

I'm having difficulty figuring out the right way to do this because I'm not sure if I should bind the scroll event to the window or detect the offset of the directive element itself.

Here's what I've tried so far: http://jsfiddle.net/6VFJs/1/