Question

所以我一直在使用Angular（4.x.x），我想使用twitter bootstrap，因为它看起来不错。

这就是混乱开始的地方： Bootstrap需要jQuery。但是，共识似乎是，不要在Angular应用程序中使用jQuery。

因此，似乎有一些GitHub项目具有原生的Angular代码，可以将jQuery排除在等式之外。

我查看了ng-bootstrap，并转到他们的文档，了解如何安装它。一切顺利，除了CSS样式不包括在内，文档也没有告诉你如何获得CSS样式。似乎是“入门”指南的基本必需品，但无论如何。

所以我做了一些Google-fu，找到了一个关于如何安装ng-bootstrap和样式的简洁，完整的指南。

https://medium.com/codingthesmartway-com-blog/using-bootstrap-with-angular-c83c3cee3f4a

然后我进入了让我做成龙模因的段落..

Ng-Bootstrap包含一组基于Bootstrap标记和CSS的原生Angular指令。因此，不需要依赖jQuery或Bootstrap的JavaScript。 ... 现在将bootstrap.min.css，jquery.min.js和bootstrap.min.js添加到.angular-cli.json文件中，就像我们之前做的那样。

如果ng-bootstrap应该删除对jquery和boostrap JS的需求，为什么我要添加bootstrap.min.js和jquery.min.js？！

我找不到合理的解释。有人可以澄清这种混乱吗？

Answer 1

我认为您不需要添加bootstrap.min.js或jquery.min.js来使用ng-bootstrap。请检查以下链接。

https://github.com/ng-bootstrap/ng-bootstrap

无论如何bootstrap在内部使用jquery。这并不意味着您需要在组件，指令等中使用它。并且强烈建议不要使用角度内的jquery。

修改

混乱：

ng-bootstrap包含一组基于Bootstrap标记和CSS的原生Angular指令。因此不需要依赖jQuery或Bootstrap的JavaScript 。唯一需要的依赖项是：

Angular

Bootstrap CSS

ng-bootstrap getting started

Answer 2

当人们说你不想在你的Angular项目中使用jquery时，它们直接意味着你的组件或html。使用第三方npm模块是完全正常的，并且可以以干净和安全的方式快速轻松地将引导程序集成到Angular环境中。我强烈建议你使用Angular-CLI，如果你还没有。

只需npm install --save boostrap，然后包含 .angular-cli.json 中所需的css文件和脚本。

  "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "../node_modules/font-awesome/css/font-awesome.min.css",
    "styles.scss"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/tether/dist/js/tether.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.min.js"
  ],

注意：正如你所提到的，即使这些“Angular bootstrap”模块正在使用jquery和bootstrap css，而且从我的经验来看，这对桌子来说绝对没什么新意。当Angular和bootstrap快速并行发展时，他们可能会有一个用途，但现在更多的工作没有奖励。

Answer 3

在你的应用程序Angular中的文件.angular-cli.json把这个

 "styles": [
    "styles.css",
    "../node_modules/font-awesome/css/font-awesome.css",
    "../node_modules/bootstrap/dist/css/bootstrap.css"
  ]

你必须安装bootstrap的npm packgage

我希望它可以帮助你

有人可以解决一些关于如何一起使用twitter bootstrap和Angular 4的困惑吗？

3 个答案: