Question

我正在尝试执行以下应用bootstrap样式的方法。 navbar-fixed-top将元素位置固定在顶部。 #subnav将显示或隐藏取决于showsubnav值。

<div id="backnav">
    <div id="topnav" class="container-fluid navbar-fixed-top">
        <nav id="mainnav" class="navbar navbar-default"></nav>
        <nav id="subnav" class="navbar navbar-inverse" ng-show="showsubnav"></nav>
    </div>
</div>

http://jsfiddle.net/20f02378/

如何让#backnav高度与#topnav相同？

Answer 1

您想要实现的目标的问题属于这个问题Fixed position but relative to container

获取元素的高度不会对你有所帮助，除非你打算在你想要下推的内容的顶部添加一个填充，或者覆盖CSS。但是，要回答这个问题，要获得元素的高度：

var height = angular.element('#backnav').height();

Answer 2

正如我所说，您可以使用ngStyle实现此目的。这是一个解决方案。

<div ng-style="myStyle" ng-controller="MainController">
    <div id="topnav" class="container-fluid navbar-fixed-top">
        <nav id="mainnav" class="navbar navbar-default"> 
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#">Link</a></li>
            </ul>
        </nav>
        <nav id="subnav" class="navbar navbar-inverse" ng-show="Config.showsubnav">
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#">Link</a></li>
            </ul>
        </nav>
    </div>
</div>

在控制器中

app.controller('MainController', ['$scope','Config', function($scope,Config){
$scope.Config = Config;
$scope.myStyle={};
$scope.myStyle.border="1px solid blue";
$scope.myStyle.height="59px";  
if(Config.showsubnav)
{
    $scope.myStyle.height="118px";  
}
}]);

我希望，这就是你要找的东西。 http://jsfiddle.net/paje007/a7n2xtad/

AngularJS获得＆amp;设置元素高度

2 个答案: