“ng-bootstrap”和“ngx-bootstrap”有什么区别？

ng-bootstrap 和 ngx-bootstrap 是两个不同项目团队的两个不同项目，它们试图完成或多或少相同的事情 - 允许您在不使用 jQuery 的情况下在 Angular (2+) 中使用 Bootstrap。

他们都只使用 Angular（没有 jQuery）重建 Bootstrap 组件。主要区别在于它们支持的 Bootstrap 版本。

ngx-bootstrap 支持 Bootstrap 3 和 4。

ng-bootstrap 支持 Bootstrap 4 并且需要 Angular 5+。

这意味着如果您需要使用 Bootstrap 版本 3，那么 ngx-bootstrap 是您在两者中唯一真正的选择。如果您可以使用 Bootstrap 4，那么您可以在两个项目之间进行选择。

另一个（可能显着的）差异是项目背后的团队。在这方面需要注意的关键点是 ng-bootstrap 背后的团队还负责 angular-ui-bootstrap - Bootstrap 库的 AngularJS（即 1.x）版本。

---

我正在考虑为我的项目使用什么，然后在比较了两个项目之后，我认为 valor-software 的 ngx-bootstrap 是一个更好的选择，因为它的模态组件中内置了动画。 Ng-bootstrap 动画仍然不存在，弹出一个没有动画的模态是一个很大的麻烦。其他原因是 Ng-bootstrap 仍处于测试阶段，与 ngx-bootstrap 相比，我无法将它用于我的生产应用程序，后者已经有一个发布候选版本（12.22.2017）。但是，我希望这两个项目都好运，并希望能提出可靠的解决方案。

---

2021 年更新：从 v8.0.0 in ng-boostrap 开始，动画默认开启，并可在所有标准引导组件上使用。

我已经使用了 ngx-bootstrap（由 Valor）和 ng-bootstrap（由 ng-boostrap）。这是我从他们那里获得的独特功能中的两分钱：

ngx-bootstrap:

几乎所有东西的内置动画支持（模态，手风琴，折叠，下拉，日期选择器......）更好的模态支持（嵌套模态，模态作为服务，模态作为模板）可排序组件（具有拖放功能）

ng-bootstrap:

导航功能（Tabset 已弃用）内置 Toast 组件包大小几乎是 ngx-bootstrap 的一半（缩小 + Gzipped）

您还可以将他们的 npm 下载计数与 npmtrends 进行比较。

[注意：我的回答基于当前最新版本，即 ngx-bootstrap v5.5.0 和 ng-boostrap v6.0.0]

---

同意@Dilshan。我还决定为我们的新产品选择 ngx-bootstrap。经过一番研究，我发现 ngx 对于生产来说更加成熟和稳定。 ng-bootstrap 正在开发中。

一个很好的参考资源，CoreUI.io 具有完整的功能 CoreUI + Angular 5.x + ngx-bootstrap sample project。我实际上从这个项目中学习了 ngx。您可以浏览其实时预览或下载项目包。

---

一个区别在于他们的日期选择器使用的格式。 ng-bootstrap 使用一个对象，但 ngx-bootstrap 将采用一个更易于使用的字符串。

---

ng-bootstrap 似乎不受支持 - 最高请求是 appendTo 正文，维护者说他没有从事该项目。

我一直在将所有东西都切换到 ngx-bootstrap

---

问题中提到的 ng-bootstrap（https://ng-bootstrap.github.io 中的那个）不是 npm 包 ng-bootstrap。

相反，npm 包是 @ng-bootstrap/ng-bootstrap

它是由不同的团队开发的。

$ npm 查看@ng-bootstrap/ng-bootstrap

@ng-bootstrap/ng-bootstrap@3.2.0 |麻省理工学院 |部门：1 |版本：61 Angular 驱动的 Bootstrap https://github.com/ng-bootstrap/ng-bootstrap#readme

npm 包 ng-bootstrap 看起来确实是 ngx-bootstrap 的旧版本。

---

与其说是答案，不如说是扩展评论...

我不太确定团队是否独立。运行 npm view ngx-bootstrap 和 npm view ng-bootstrap 表明两者都是使用相同的电子邮件帐户发布的。

我认为这两个团队是相关的。

npm 查看 ngx-bootstrap

C:\:
17:07:25.16>npm view ngx-bootstrap

ngx-bootstrap@3.0.1 | MIT | deps: none | versions: 40
Native Angular Bootstrap Components
https://github.com/valor-software/ngx-bootstrap#readme

keywords: angular, bootstap, ng, ng2, angular2, twitter-bootstrap

dist
.tarball https://registry.npmjs.org/ngx-bootstrap/-/ngx-    bootstrap-3.0.1.tgz
.shasum: e98d2fc6340f32a9d358cd08e8fda7dcb23bdab3
.integrity: sha512-ni91yYtn8ldgf/pxrlwl9lkVcLURGzopSpJnEbbgG1v1EZWTobI8y7J3mx4Kxptkn0EeiQwnLel67G7XJSox4A==
.unpackedSize: 8.4 MB

maintainers:
- valorkin <valorkin@gmail.com>

dist-tags:
latest: 3.0.1       next: 3.0.1         test: 0.0.0-test.0

published a month ago by valorkin <valorkin@gmail.com>

npm 查看 ng-bootstrap

C:\:
17:16:42.36>npm view ng-bootstrap

ng-bootstrap@1.6.3 | MIT | deps: 1 | versions: 8
Native Angular Bootstrap Components
https://github.com/valor-software/ngx-bootstrap#readme

keywords: ng, ng-bootstap, angular, angular2, bootstrap, twitter-bootstrap

dist
.tarball https://registry.npmjs.org/ng-bootstrap/-/ng-bootstrap-1.6.3.tgz
.shasum: d41fd42154c0593422cb83c473a3828aa7525bf5

dependencies:
moment: 2.18.1

maintainers:
- pkozlowski_os <pkozlowski.opensource@gmail.com>
- ng-bootstrap <foxandxss@gmail.com>

dist-tags:
beta: 1.1.16-3  latest: 1.6.3

published a year ago by valorkin <valorkin@gmail.com>

---

这取决于需要，但遵循经验法则，ng-bootstrap 通常更合适，原因如下：

ng-bootstrap 有更多的星星

ng-bootstrap 是相对较新的解决方案

ng-bootstrap 更轻

如果我没有任何特定的理由选择 bootstrap 3，那么 ng-bootstrap 应该是首选。

有关事实和数据的更多详细信息，请参阅以下 github 存储库：

https://github.com/valor-software/ngx-bootstrap

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

---