Angularjs - 窗口滚动时无法正确使用指令

Question

我在这里听到了这个答案：Bind class toggle to window scroll event因为我需要在窗口滚动时使用ngClass绑定类，并且根据上面提到的答案，我应该能够这样做：

app.directive("scroll", function ($window) {
    return function(scope, element, attrs) {
        angular.element($window).bind("scroll", function() {
             if (this.pageYOffset >= 100) {
                 scope.boolChangeClass = true;
                 console.log('Scrolled below header.');
             } else {
                 scope.boolChangeClass = false;
                 console.log('Header is in view.');
             }
            scope.$apply();
        });
    };
});

但是当我将这个代码用于我的应用程序时，它根本没有触发该指令！

这是我的代码： http://codepen.io/nickimola/pen/dMNawj?editors=1010

我尝试添加一个调试器，我注意到这个指令只在窗口加载时调用，但之后不再调用它。

我在这里做错了什么？

感谢您的帮助