我正在使用 Angular 4、Bootstrap 4 beta 2 和 ng-bootstrap 来开发我的应用程序,并且还在使用 ng-bootstrap。
我从 Bootstrap 文档示例中添加了导航栏。
代码如下:
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
我也在angular-cli.json中添加了bootstrap样式。 代码看起来像这样:
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"styles.css"
],
在移动视图中,面包屑按钮在单击时没有响应。当我尝试检查相同的内容时,我发现“collapsed”类在单击按钮时未被添加。
![输入图像描述](https://istack.dev59.com/SMXdt.webp)