Question

我有一堆页面遵循相同的布局，但其中一些页面有一个＆＃34; secondary＆＃34;顶部的导航栏。当此导航栏存在时，我必须使用较少的margin-top从页面中向下推送主要内容。

我的问题是我无法通过DOM找到一种干净的方法。

sample.html

<!-- The secondary navigation below the header -->
<div class="navigation-row text-center">
    <div class="col-xs-offset-2 col-xs-8 text-center">
        <h4> Sample Page </h4>
    </div>
</div>

<!-- Main Content -->
<div class="row">
    ...

index.html （每个页面使用的继承模板）

<!-- Main Content -->
<div class="content container-fluid">
    <div ng-class="{'secondary-nav' : document.getElementsByClassName('navigation-row').length > 0}" ui-view="main"></div>
</div>

所以基本上在我的主要内容部分中，我试图检查页面上是否存在类navigation-row（导航行是辅助导航栏的类），如果是，则添加类{{1到div。

我尝试使用angular.element，看起来像

secondary-navbar-padding

但它没有用。这甚至可能吗？我是否正确地接近这个问题，或者如果有更好的清洁方法可以做到这一点，我也愿意这样做。

Answer 1

我认为您只是检查document元素本身是否具有该类。

您可以像这样计算该类的元素数量：

document.getElementsByClassName('navigation-row').length

所以你可以这样使用ng-class：

<div class="row" ng-class="{'secondary-navbar-padding' : document.getElementsByClassName('navigation-row').length > 0}">

使用Angular

1 个答案: