Javascript AngularJS显示元素onScroll函数

下面是我们的javascript：

window.onscroll=function(){scrollShow()};
    function scrollShow(){
        if (document.documentElement.scrollTop>150){
            document.getElementById("myBtn").style.display="block";
        } else {
            document.getElementById("myBtn").style.display="none";
        }
    }

---

如何在AngularJS中实现相同的功能？

您可以通过创建一个指令来实现

<button id='myBtn' scroll-show></div>

app.directive('scrollShow', [function() {
  return {
    link: function (scope, elem, attrs) {
      elem.on('scroll', function (e) {
        if(....) {
            element.hide();
        } else {
            element.show();
        }
      });
    })
  }
}]);

---

我认为最好的方法是创建一个指令。您可以将创建的指令附加到html标记/组件/指令，并将事件侦听器附加到该窗口。您可以尝试这种方法

角度。模块'myModule'，[] .directive'myScrollShowDirective'，['$window'，function$window{ 函数链接范围、元素、属性{ var格式， 超时ID； //或以jquery样式附加事件 $window.addEventListener'scroll'，scrollShow； 功能滚动显示{ 如果$window.document.documentElement.scrollTop>150{ element.style.display=block； }否则{ element.style.display=none； } } 元素。在“$destroy”上，函数{ $window.removeEventListener'scroll'，scrollShow； }; } 返回{ 链接：链接 }; }];