276

ng-bootstrap和 和有什么不一样ngx-bootstrap?它们相互关联吗?还是它们只是并发实现?

是否有人与他们一起工作并且可以给出/解释两者的优缺点?

我的ng-bootstrap意思是ng-bootstrap.github

ngx-bootstrap我的意思是valor -software-ngx-bootstrap

两者都与 Angular 4(不是 AngularJS!)和 Bootstrap 4 有关。

请注意,这不是ngx-bootstrap 和 ng2 bootstrap 之间区别的重复问题吗?.

4

9 回答 9

257

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)版本。

于 2017-05-25T00:57:16.260 回答
44

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

于 2017-12-22T15:41:57.143 回答
31

2021 年更新:从v8.0.0 开始,ng-boostrap动画默认打开,并且可用于所有标准引导组件。


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

ngx 引导程序:

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

ng引导:

  1. 导航功能(标签集已被弃用)
  2. 内置 Toast 组件
  3. 包大小几乎是 ngx-bootstrap (Minified + Gzipped) 的一半

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

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

于 2020-02-25T12:05:11.313 回答
18

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

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

于 2018-02-03T04:54:12.043 回答
9

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

于 2018-03-21T22:57:29.293 回答
8

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

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

于 2018-05-07T20:48:36.047 回答
7

问题中提到的 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 的旧版本。

于 2018-09-10T14:29:07.973 回答
5

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

我不太确定团队是否独立。运行npm view ngx-bootstrapnpm 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>
于 2018-08-02T22:35:22.510 回答
2

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

  • ng-bootstrap 有更多的星星
  • ng-bootstrap 是相对较新的解决方案
  • ng-bootstrap 更轻

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

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

于 2020-09-18T11:47:34.500 回答