angularjsのdiv要素の高さを取得し、それを別の要素の属性に設定します。

Question

angularjsで要素の高さを取得し、別のdivの属性に配置できますか？

サイドバーが付いているブートストラップのウェブページがあります。ウェブページのフッタの前に正しく停止するために、フッタの高さを貼り付けの属性に指定する必要があります。 現在、私はこれを手動で行っています。

それは主に次のようになります。

ビュー1：

<div class="affix-top" data-spy="affix" data-offset-bottom="300"> 
... 
</div> 

をレイアウト（メイン）ビュー：

... 
<div id="footer"> 
... 
</div> 

は、フッターの手動で入力された高さでありますビュー1を次のように変更したい（擬似コード）：

<div class="affix-top" data-spy="affix" data-offset-bottom="{{#footer.height()}}"> 
... 
</div> 

これは可能ですか？もしそれがangularjsで簡単ではない、私は可能な場合は別のJavaScriptを使用せずにその機能を得るために使用することができますか？

Answer 1

角度範囲の変数をデフォルト値に初期化します。それが利用可能になったらそれを埋める。

$scope.height = 0; 

$scope.updateHeight = function(){ 
    $scope.height = document.querySelector("#wantedDiv").clientHeight; 
    console.log("height is now: "+$scope.height); 
    if(!$scope.$$phase) $scope.$apply(); 
}; 
window.onload= $scope.updateHeight; 

あなたのhtmlでの使用：また

<div class="affix-top" data-spy="affix" data-offset-bottom="{{height}}"> 
... 
</div> 

、あなたがしたい任意の他のイベントにこれを割り当てることができます。

window.onresize= $scope.updateHeight;