कोणीय सामग्री का चयन निश्चित ब्लॉक पर अजीब तरह से कार्य करता है

Question

मैंने एक साइड ब्लॉक बनाया है जो डिफ़ॉल्ट रूप से static है, लेकिन जब आप किसी बिंदु पर स्क्रॉल करते हैं तो fixed बन जाता है। और इस ब्लॉक में मैं कोणीय-सामग्री का चयन करता हूं।

सीएसएस:

.pos-fixed { 
    position:fixed; 
    top: 60px; 
    width:16.5%!important; 
} 

#sidebar-right { 
    float:right; 
    width:23%; 
} 
#sidebar-right #widget { 
    width:100%; 
} 

HTML:

<div id="sidebar-right"> 
    <div id="widget" ng-class="{'pos-fixed': imageHidden}" class="panel md-padding"> 
     <div> 
     <md-input-container style="width:100%"> 
      <md-select ng-model="number1" placeholder="number 1"> 
      <md-option ng-repeat="number in ['one','two','three','four','five','six','seven']" value="{{number}}">{{number}}</md-option> 
      </md-select> 
     </md-input-container> 
     <br /> 
     <md-input-container style="margin-top: 0px;width:100%"> 
      <md-select ng-disabled="!number1" ng-model="number2" placeholder="numbe 2"> 
      <md-option ng-repeat="number in ['one','two','three','four','five','six','seven']" value="{{number}}">{{number}}</md-option> 
      </md-select> 
     </md-input-container> 
     </div> 
    </div 

जे एस (स्क्रॉल जासूस):

app.directive('scroll', function($window) { 
    return function(scope, element, attrs) { 
    angular.element($window).bind('scroll', function() { 
     if (this.pageYOffset >= 320) { 
     scope.imageHidden = true; 
     } else { 
     scope.imageHidden = false; 
     } 
     scope.$apply(); 
    }); 
    }; 
}); 

पहले पक्ष ब्लॉक fixed है, सामग्री का चयन ठीक काम करता है, लेकिन जैसे ही जैसे ही आप स्क्रॉल करते हैं और यह fixed बन जाता है, अजीब तरीके से कार्य करने के लिए प्रारंभ करें चुनें।
GIF: http://recordit.co/i72EaaVxJf
Plunker: http://plnkr.co/edit/lfik78wR2FqPoSFSCNlz?p=preview

मैं इसे कैसे ठीक कर सकते हैं?

Answer 1

scroll निर्देश के बजाय अपने नियंत्रक को यह करें:

var body = document.querySelector('body'); 
angular.element($window).bind('scroll', function() { 
    if (body.style.position !== 'fixed') { 
    $scope.isFixed = window.scrollY > 330; 
    $scope.$applyAsync(); 
    } 
});