触发ng风格的变量更改

Question

我创建了一个指令来更改主页上导航栏的背景颜色。

app.directive("scroll", function ($window,$location) {
    return function(scope, element, attrs) {
      angular.element($window).bind("scroll", function() {       
        console.log(this.pageYOffset);   
        if (this.pageYOffset > 0) {
          scope.backgroundCol = "black";
        } else {
          scope.backgroundCol = "transparent";
        }
        scope.$apply();
      });
    };
});

在index.html页面中，我将绑定添加到backgroundCol变量。

<nav id="mainNav" ng-controller="MainController" ng-style="{'background': backgroundCol}" class="navbar navbar-default navbar-fixed-top">

在我的home.html中（通过ng-view绑定），我将绑定添加到scroll指令：

<div class="container fill" scroll>

该指令已注册，我可以看到偏移量，但我无法改变导航栏的颜色。