Angularjs 滚动页面时如何隐藏元素？

好吧，我有点不知所措

我试图从jQuery背景中思考角度

问题是： 如果窗口没有滚动，我只想隐藏一个固定的元素。如果有人向下滚动页面，我想隐藏元素

我尝试创建一个自定义指令，但由于滚动事件未触发，因此无法使其工作。我在想下面这样一个简单的控制器，但它甚至不运行

控制器：

.controller('MyCtrl2', function($scope,appLoading, $location, $anchorScroll, $window ) {
   angular.element($window).bind("scroll", function(e) {
       console.log('scroll')
       console.log(e.pageYOffset)
       $scope.visible = false;
   })
})

看法

任何想法都将不胜感激。
基本指令如下所示。一个关键点是您需要调用
作用域。$apply（）
，因为滚动将在正常的
摘要
周期之外运行

app = angular.module('myApp', []);
app.directive("scroll", function ($window) {
    return function(scope, element, attrs) {
        angular.element($window).bind("scroll", function() {
            scope.visible = false;
            scope.$apply();
        });
    };
});

我找到了这个jsfiddle，它很好地演示了它
，感谢Eddiec，出于某种原因，scroll事件在点击页面底部之前不会运行。请参见此处的控制台日志：您有一个
overflow-x:hidden
在您的
hh
类（app.css第3行）上，这似乎阻止了scroll持续启动。当指令被破坏时，这会自动解除事件绑定吗？如何获得
$（窗口）。scrollTop（）
我遇到了这个解决方案：）并且我对apply函数感到困惑，这里有一篇很好的文章，如果有人感兴趣，可以很好地描述它。
app = angular.module('myApp', []);
app.directive("scroll", function ($window) {
    return function(scope, element, attrs) {
        angular.element($window).bind("scroll", function() {
            scope.visible = false;
            scope.$apply();
        });
    };
});