获取angularjs中div元素的高度并将其设置为另一个元素的属性

时间:2017-02-18 17:37:37

标签: javascript html angularjs

是否可以使用angularjs获取元素的高度并将其放在另一个div的属性上?

我有一个带侧边栏的bootstrap网页,为了让它在网页页脚之前正确停止我必须在词缀的属性中指定页脚的高度。 目前我手动执行此操作。

它看起来大概是这样的:

查看1:

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

布局(主要)视图:

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

300 是手动输入的页脚高度,我想将View 1更改为类似的内容(伪代码):

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

这可能吗?如果在angularjs中不那么容易,我可以使用什么来获得该功能而不使用单独的javascript?如果可能的话?

1 个答案:

答案 0 :(得分:0)

将角度范围的变量初始化为默认值;一旦可用,请填写。

$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;