Изменение css при прокрутке Angular Стиль

Я хочу изменить элементы CSS, пока пользователь прокручивает путь angular.

здесь код, обрабатывающий путь JQuery

$(window).scroll(function() {
    if ($(window).scrollTop() > 20 && $(window).scrollTop() < 600) {
        $('header, h1, a, div, span, ul, li, nav').css('height','-=10px');
    } else if ($(window).scrollTop() < 80) {
        $('header, h1, a, div, span, ul, li, nav').css('height','100px');
    }

Я попробовал сделать angular способ со следующим кодом, но $scope.scroll, казалось, не смог правильно загрузить данные прокрутки.

forestboneApp.controller('MainCtrl', function($scope, $document) {
    $scope.scroll = $($document).scroll();
    $scope.$watch('scroll', function (newValue) {
        console.log(newValue);
    });
});

Muchos gracias amigos!

app.directive('scrollPosition', function($window) { return { scope: { scroll: '=scrollPosition' }, link: function(scope, element, attrs) { var windowEl = angular.element($window); var handler = function() { scope.scroll = windowEl.scrollTop(); } windowEl.on('scroll', scope.$apply.bind(scope, handler)); handler(); } }; });

Ответ 1