CSS更改不会立即应用

Question

降低头部应该改变颜色,但是没有看到变化,如果我打开菜单只有改变就可以看到.

<ion-header-bar class="thediv" ng-class="{scrolling: isActive}">
     <ion-nav-bar class="bar-clear "  >         
     </ion-nav-bar>
     </ion-header-bar>

我的课:

.scrolling{
  background-color: red !important;
}

和代码:

if ($ionicScrollDelegate.$getByHandle('contentScroll').getScrollPosition().top > 100) {       
     $scope.isActive = true;
} else {
    $scope.isActive = false;
}

演示

http://virtual-host-discourse.global.ssl.fastly.net/uploads/ionicframework/optimized/2X/7/7fcbaa68a40008e90de10292d80559c3eb5e17bf_1_326x500.gif

Answer 1

我的假设是，当您影响 时，不会处理摘要循环$scope.isActive。

尝试将其包装成 a $timeout（不要忘记添加$timeout为依赖项）

if ($ionicScrollDelegate.$getByHandle('contentScroll').getScrollPosition().top > 100) {       
  $timeout(function(){
     $scope.isActive = true;
  },0)
} else {
  $timeout(function(){
    $scope.isActive = false;
  },0)
}