【问题标题】:Bootstrap in angular project won't work properly角度项目中的引导程序无法正常工作
【发布时间】:2018-11-17 21:12:33
【问题描述】:

我正在尝试在我的 Angular 项目中使用引导导航栏。我是这样安装的:

在 cli 中安装 bootstrap + jquery:

npm install bootstrap jquery --save

angular-cli.json:

  "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "styles.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.min.js"
  ],

这是我的html:

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">WebSiteName</a>
    </div>
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">Page 1</a></li>
      <li><a href="#">Page 2</a></li>
      <li><a href="#">Page 3</a></li>
    </ul>
  </div>
</nav>

如果您需要其他内容,请在 cmets 中询问。

这是我得到的:

这就是我所期望的:

【问题讨论】:

  • “行不通”...什么行不通?
  • 我明白为什么在大多数情况下,但这是无法正常工作的引导程序的纯安装......但如果你想要的话......
  • 已更新。你有代码 + 我的输出是什么,我期望是什么。
  • 你试过非缩小版的css和js文件吗?
  • @GopakumarGopalan 我刚试过但没有区别......

标签: html angular bootstrap-4


【解决方案1】:

找到了。

我使用的是 bootstrap 3 类,我导入了 bootstrap 4。愚蠢的错误!

抱歉给您添麻烦了。

【讨论】:

    猜你喜欢
    • 2020-12-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-11-25
    • 1970-01-01
    • 2021-10-12
    • 2022-10-05
    相关资源
    最近更新 更多