ui-bootstrap-tpls 和 ui-bootstrap

ui-bootstrap-tpls and ui-bootstrap

在我的应用程序中,我使用了 boostrap.ui 的 $modal 指令。我还使用具有下拉功能的 Bootstrap 导航栏。

我遇到了无法找到 window.html 的问题 as described in this topic

我的问题是我同时包含一个 ui-boostrap.js 文件和一个 ui-bootstrap-tpls 文件 (v1.3.2)

According to this topic,我应该只需要tpls文件。 但是,当我删除 boostrap.js 文件时,header 中下拉菜单的所有其他 bootstrap 功能都不再起作用。

难道不能同时使用这两种功能吗?

UI-Bootstrap 库只是核心 Bootstrap 库的 Angular 包装器,用于从应用程序中删除 jQuery 的依赖性。来自文档:

This repository contains a set of native AngularJS directives based on Bootstrap's markup and CSS. As a result no dependency on jQuery or Bootstrap's JavaScript is required.

ui-bootstrap-tpls.min.jsui-bootstrap-tpls.js 包含 Bootstrap 提供的所有 Javascript 模块的默认模板,即为什么它被命名为 -tpls.

其他文件 ui-bootstrap.min.jsui-bootstrap.js 不包含 Javascript modules/features.

的任何模板

因此,如果您不打算覆盖任何模板,您应该只包含 ui-bootstrap-tpls.min.jsui-bootstrap-tpls.js

关于为什么删除 bootstrap.js 后下拉列表停止工作的答案是您的 HTML 代码仍在使用 Bootstrap 的 jQuery 版本,但您应该开始使用ui-bootstrap 那些模块的版本。是的,可以包含 bootstrap 的 Angular 版本(即 ui-bootstrap.min.js)和 bootstrap 的 jQuery 版本(bootstrap.js),但是这将是应用程序的额外开销。

如果您已经包含 ui-bootstrap 库,则无需 jQuery 即可使用 Bootstrap 的 Javascript 功能.

正如 shashank 所解释的,bootstrap.js 中的所有 bootstrap 元素都转换为 ui-bootstrap-tpls 中的 angular 指令。 如果您只是简单地替换文件,它不会像您预期的那样工作。

如果更改为ui-bootstrap-tpls,则需要将相应的bootstrap组件更改为angularui指令。