javascript - ng-show 改变 div 中的最小高度

标签 javascript html css angularjs

我有一个 div,它有一个 wrapper 类。它的内部有一个父级 div,其类为 content-wrapperwrapper div 有一个 ng-show,它返回 true/false

<div class="wrapper" ng-show="firebaseUser">
   <% include ../partials/nav.ejs %>
   <div class="content-wrapper">
      <ng-view></ng-view>
   </div>
   <% include ../partials/footer.ejs %>
</div>

content-wrapper 只有一点点 css,使其适合整个屏幕。以防万一它有帮助,我也包含了父样式。

.wrapper {
    min-height: 100%;
    position: relative;
    overflow: hidden;
}

.content-wrapper, .right-side {
    min-height: 100%;
    background-color: #ecf0f5;
    z-index: 800;
}

现在,当我使用 ng-show 时,屏幕滚动的距离超过了窗口的高度。

如果我检查(然后刷新页面),它(.content-wrapper)看起来在页面加载时它的样式为min-height: 532px;

如果我在没有页面刷新的情况下检查页面。这意味着它会重新调整到新的窗口高度,它的样式为 min-height: 422px;

如果我不使用ng-show,屏幕总是适合窗口,我没有任何问题。

什么是 ng-show 调整以及如何解决此问题?

附注我尝试使用 ng-if 代替,结果是整个屏幕非常短且小。所以,比 ng-show 更糟糕。

最佳答案

这根本不是使用 Angular 的方式。强烈建议阅读Thinking in angular when I have a jQuery background

关于javascript - ng-show 改变 div 中的最小高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37737453/

相关文章:

javascript - 在多选中我如何使用jquery获取点击值

javascript - 如何更改显示 jQuery 输入的位置

jquery - 文本隐藏在图像下方

html - CSS - margin top of 50% 超过 50%

html - 在 HTML 中设置表格的高度没有效果

javascript - 将 'var' 声明移至函数顶部 - Javascript 错误

javascript - CompositeView 不呈现 ItemView,甚至不触发 appendHtml

javascript - jQuery 隐藏和显示多个 div

javascript - 获取 Canvas 内的相对触摸坐标

javascript - 具有类名的多个复选框更改功能,但 JavaScript 中的类名相同