Question

我是学习Angular的新手。我试图在角度4中导入bootstrap 4单页模板这一个：https://startbootstrap.com/template-overviews/new-age/。但是当我在我的localhost中看到它时，它没有加载一些像平滑滚动等功能..看起来像new-age.js文件没有加载。怎么解决这个问题？

保存的文件（css，js，jquery，bootstrap）位于src / assests文件夹中。
我在angular.json中链接了文件，如

"styles": [
          "src/styles.css",
          "src/assets/vendor/bootstrap/css/bootstrap.min.css",
          "src/assets/vendor/font-awesome/css/font-awesome.min.css",
          "src/assets/vendor/simple-line-icons/css/simple-line-icons.css",
          "src/assets/device-mockups/device-mockups.min.css",
          "src/assets/css/new-age.min.css"
        ],
        "scripts": [
          "src/assets/vendor/jquery/jquery.min.js",
          "src/assets/vendor/bootstrap/js/bootstrap.bundle.min.js",
          "src/assets/vendor/jquery-easing/jquery.easing.min.js",
          "src/assets/js/new-age.js"
        ]

HTML位于app.component.html

中

Answer 1

使用角度，我建议改用ng-bootstrap。您需要做的就是在angular-cli.json中导入bootstrap的样式表（以及之后的个人样式表（！））：

"styles": [
          "src/assets/vendor/bootstrap/css/bootstrap.css",
          "src/styles.css"
        ],

然后在app.module的import数组中导入ng-bootstrap，其中包含：

NgbModule.forRoot(),

您可以使用所有预制组件，适应角度。

Answer 2

试试这个，

在index.html中添加以下行，然后检查资源文件夹中是否存在脚本和css文件夹。如果不是手动添加它们并将相应的文件添加到这些文件夹中。

的index.html：

 <link rel="stylesheet" href="assets/css/bootstrap.min.css">
 <link rel="stylesheet" href="assets/css/bootstrap-theme.min.css">
 <link rel="stylesheet" href="assets/css/font-awesome.min.css">
 <script src="assets/Scripts/bootstrap.min.js"></script>

如何在Angular 4或4+ app中导入Bootstrap 4主题

2 个答案: