[解決済み] dom のレンダリングが終了した後に、ディレクティブを実行するには？

質問

一見簡単そうに見える問題ですが、その内容は以下の通りです。 (Angular JSのドキュメントを読むと) 解決策がありません。

私は、DOM内のコンテナの高さを定義するために、他のDOM要素の高さに基づいたいくつかの計算を行うAngular JSディレクティブを持っています。

これと似たようなことがディレクティブの内部で行われています。

return function(scope, element, attrs) {
    $('.main').height( $('.site-header').height() -  $('.site-footer').height() );
}

問題は、ディレクティブが実行されたときに $('site-header') が見つからず、必要な jQuery ラップ DOM 要素の代わりに空の配列が返されることです。

DOMがロードされた後にのみ実行され、通常のjQueryセレクタスタイルのクエリによって他のDOM要素にアクセスできる、ディレクティブ内で使用できるコールバックはありますか？

どのように解決するのですか？

$('site-header') がどのように構築されているかに依存します。

を使ってみてください。 $timeout を0遅延で使用してみてください。こんな感じ。

return function(scope, element, attrs) {
    $timeout(function(){
        $('.main').height( $('.site-header').height() -  $('.site-footer').height() );
    });        
}

動作の説明 1 , 二 .

を注入することを忘れないでください。 $timeout をディレクティブに注入することを忘れないでください。

.directive('sticky', function($timeout)