如何在滚动条到达特定高度时使用 AngularJS 指令更改按钮的颜色

Question

你好我是AngularJS的新手，我想使用AngularJS指令在滚动条移动到一定高度时改变按钮的颜色，任何详细非常感谢回答和帮助。

Answer 1

试着看看 angular-scroll-watch : https://github.com/pc035860/angular-scroll-watch.

Answer 2

假设您的按钮初始颜色为蓝色，当滚动条到达页面底部时，您的按钮将变为绿色。

指令如下：

angular.module('newProjectApp')
.directive('myButton',function() {
    return {
      restrict: 'E',
      template:
        '<button class="btn {{color}}" type="button" value="Submit">' +
        '</button>',
      scope: {},
      link: function(scope, $window) {
        scope.color ='primary-button';

        scope.$watch(function(){
        return $window.scrollY;
        }, function(){
          scope.color="success-btn";
        }, true);
      }
    };
  }
);

如何在滚动条到达特定高度时使用 AngularJS 指令更改按钮的颜色

How to change the color of a button using AngularJS directive when scrolling bar reaches at a certain height

directive

colors

scrollbar

button

angularjs