Where to applying events to window object and how to unbind them

[bas...@gmail.com]

So I have a feature in an application I am building for infinite scrolling on the window.  To achieve this, I have the following code in my controller:

    $(window).bind('scroll.issue-loader', function(){

      if(!$scope.loadingIssues && $(this).scrollTop() + $(this).height() >= $('.user-feedback-list').offset().top + $('.user-feedback-list').height()) {

        $scope.loadIssues();

      }

    });

The reason I am attaching the scroll to the window object is because I want to infinite scrolling functionality to be triggered on the page scrolling and not an element scrolling (otherwise it would be easy to create a directive for that).

Now I have 2 questions about this:

1.  Is the controller really the best place for this code.  I know the DOM manipulation in frowned upon in the controllers but what about event binding?  It seems like event bind should be done in the HTML with all the event directives that are built-in by default however is there anyway to attach a directive to the window object through HTML?

2.  If the controller is the best place for this, where should I unbind the event?  Is doing something like:

    $scope.$on('$destroy', function cleanup() {

      $(window).unbind('scroll.issue-loader');

    });

Inside the controller the best way of handling that?

Thanks for the help.

[Peter Bacon Darwin]

How about either putting it in a directive that you attach to the html or body tags or you could put it in a service.  Since it is a singleton you don't need to worry about it binding more than once.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en.