AngularJsディレクティブはページリロードまで動作しません

Question

私はdivをスティッキーにするangularJsディレクティブを作成しようとしています。 しかし、私は初期状態で立ち往生しています。

問題は、このスクロールイベントがページリロードでのみ発生することです。最初は経路変更では機能しません。しかし、一度ページをリロードすると、ルート変更があっても機能します。

私はここで間違っていますか？

コードは次のとおりです。

(function (angular, window) { 
 
    "use strict"; 
 

 
    function stickyDivDirective($compile, $timeout) { 
 
     function directiveLink(scope, element, attributes) { 
 

 
      function scrollFunction(targetDocument) { 
 
       console.log('Scrolling'); 
 
      } 
 

 
      angular.element(document.querySelector('md-content')).on('scroll', scrollFunction); 
 
     } 
 
     
 
     var directive = { 
 
      restrict: "A", 
 
      scope: { 
 
       mainContainer: "@", 
 
       targetContainer: "@", 
 
       offsetHeight: '@', 
 
       scrollableElement: '@' 
 
      }, 
 
      link: directiveLink 
 
     }; 
 
     return directive; 
 
    } 
 

 
    stickyDivDirective.$inject = ["$compile", "$timeout"]; 
 
    angular 
 
     .module(appSuite.module + ".directives") 
 
     .directive("stickyDiv", stickyDivDirective); 
 
})(window.angular, window);

<div class="" 
 
    id="saa__variablesBar" 
 
    sticky-div> 
 
<div>

。

Answer 1

解決策が見つかりました。 これは本当に奇妙です。私はちょうどが代わりのquerySelectorをgetElementByIdを使用します。 問題は解決しました。