使用 $scope.$on 在 AngularJS 中滚动事件

Question

有没有办法在控制器内捕获滚动页面的事件？我在组件的控制器$onInit上有这个：

$scope.$on('scroll', function() {
        console.log('Something something');
      });

我只见过在指令上使用 .bind(( 执行此操作的方法，如下所示： AngularJS 中的滚动事件

我一直潜伏在官方指南中，但一无所获。

Answer 1

您可以向链接到的指令添加一个属性，以从控制器中获取函数，以便在滚动发生时调用

.directive("scroll", function () {
return {
  restrict: 'A',
  scope : {
         "onScroll" : "&onScroll"
  },
  link: function(scope, element, attrs) {
      element.bind("wheel", function() {
         scope.onScroll();
      });
  }
}
});

然后在模板中，您将在属性值中传递它

<ul scroll on-scroll="myController.onScroll()">
</ul>

Answer 2

你可以使用 angularJS 的$element来正确地做到这一点。

angular.element($element).on('scroll', function() {
  console.log('Something something');
});

在控制器中，$element是控制器绑定到的 DOM 中的元素。