我更新到了 ng-bootstrap 的 v1.0-beta。现在导航栏总是折叠的。当我单击汉堡包来切换菜单时，它会打开，但垂直而不是水平显示内容。
我已经包含了下面的导航代码。和以前一样。此时我无法弄清楚问题是否出在 ng-bootstrap、bootstrap 4 或其组合上。
我理想的结果是菜单仅在屏幕低于特定尺寸时出现，就像过去一样。
我确实看到了Bootstrap 4 导航栏总是折叠 https://stackoverflow.com/questions/45873626/bootstrap4-navbar-always-collapsed。我打开了这个问题，因为它不包括 ng-bootstrap。
<nav class="navbar navbar-toggleable-sm navbar-light bg-faded fixed-top" style="background-color: white">
<button class="navbar-toggler navbar-toggler-right"
type="button" (click)="isNavbarCollapsed = !isNavbarCollapsed"
aria-controls="exCollapsingNavbar2"
data-toggle="collapse"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="#">Vesalius - Bobby's World</a>
<div [ngbCollapse]="isNavbarCollapsed" class="collapse navbar-collapse" id="exCollapsingNavbar2">
<div class="navbar-nav mr-auto">
<a class="nav-item nav-link" routerLink="/provider/portal/" routerLinkActive="active">Schedule</a>
<a class="nav-item nav-link" routerLink="/patient/portal/medical-history" routerLinkActive="active">Form Editor</a>
</div>
<div class="navbar-nav">
<form class="form-inline">
<input class="form-control mr-sm-2" type="text" placeholder="Search Patient">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</div>
</nav>
Bootstrap 5（2021 年更新）
正如文档中所述，
“导航栏需要包装 .navbar
.navbar-expand{-sm|-md|-lg|-xl|-xxl} 用于响应式折叠”
因此，Bootstrap 5 Navbar 与 Bootstrap 4 Navbar 相同，如果不包含，将会垂直“折叠”navbar-expand-*
Bootstrap 4（原始答案）
在 Bootstrap 4 中，navbar-expand*如果您希望导航栏水平展开，则需要类，否则它默认为移动/折叠版本。因此，不包括navbar-expand*类使导航栏always崩溃了。
看看这些导航栏断点示例 https://www.codeply.com/go/imngr08QRi
从 Bootstrap 4 beta 开始，navbar-toggleable-*课程已更改为navbar-expand-*。在你的情况下navbar-toggleable-sm会变成navbar-expand-md.
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
