【发布时间】:2019-07-09 04:54:46
【问题描述】:
我在 Angular 8 中工作,并使用以下命令通过 npm 添加了 Bootstrap
npm install jquery npm install popper.js npm install ngx-bootstrap bootstrap@4.1.1
(也尝试过 npm install bootstrap)
并使用样式和脚本更新了我的 angular.json,如下所示。
"styles": [
"src/styles.css",
"./node_modules/bootstrap/dist/css/bootstrap.min.css",
"./node_modules/font-awesome/css/font-awesome.css"
],
"scripts": [
"./node_modules/jquery/dist/jquery.min.js",
"./node_modules/popper.js/dist/umd/popper.min.js",
"./node_modules/bootstrap/dist/js/bootstrap.min.js"
]
我在 html 文件中添加了一个下拉代码,但在检查控制台时它不起作用我收到 popper.min.js 错误。
而 html 脚本是:
<div class="col-6 text-left">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown">
Project A
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Project A</a>
<a class="dropdown-item" href="#">Project B</a>
<a class="dropdown-item" href="#">Project C</a>
<a class="dropdown-item" href="#">Project E</a>
</div>
</div>
@Tony Ngo 请找截图(改变popper和bootstrap的顺序后)
【问题讨论】:
-
当您运行 ng serve/ng build 时,您的应用程序是否会加载您添加到“脚本”中的 js 文件:?您可以在检查 -> 网络选项卡中检查它
-
不要使用 jquery 等。使用为 Angular 制作的包,例如 ng-bootstrap.github.io 或 valor-software.com/ngx-bootstrap
-
@Arash 网络选项卡不显示这些脚本它只显示默认脚本
-
@user1234 它应该加载您添加到 "styles": [ 和 "scripts": [ 中的任何内容
标签: javascript angular typescript single-page-application angular8