title: Hide a div on scroll with AngularJS
body: <p>I am new to AngularJS. I want to hide div "A" in AngularJS when a user scrolls on div "B". Currently I can hide the div "A" when user clicks on div "B" by using ng-click, but I could not find any way to do it with on scroll with AngularJS. I know, I can use JQuery to hide the div but is there any way to do it with AngularJS?</p>
  
  <p>Update:</p>
  
  <p>I created a scroll directive and attached it with $window. Now the div is hidden if I scroll the full window, but I want to hide it when a particular div is scrolled. My current implementation looks like bellow:</p>
  
  <pre><code>
  
      app.directive("scroll", function ($window) {
          return function(scope, element, attrs) {
              angular.element($window).bind("scroll", function() {
                  if (this.pageYOffset >= 10) {
                      scope.hideVs = true;
                  } else {
                      scope.hideVs = false;
                  }
                  scope.$apply();
              });
          };
      });
  
  </code></pre>