如何手动安装AngularJS ui.bootstrap答案

【问题标题】：How to manually install AngularJS ui.bootstrap如何手动安装AngularJS ui.bootstrap
【发布时间】：2015-08-26 00:33:45
【问题描述】：

我正在构建一个 SPA 以在 SharePoint 2013 在线页面上运行，但手动安装 ui-bootstrap 时遇到问题。

我已下载此文件https://github.com/angular-ui/bootstrap/blob/master/src/modal/modal.js 并保存为 ui-bootstrap.js。

然后我引用 index.html 中的文件：

 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
 <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <script type="text/javascript" src="~site/Webparts/js/angular.min.js"></script>
 <script type="text/javascript" src="~site/Webparts/js/angular-route.min.js"></script>
 <script type="text/javascript" src="~site/Webparts/js/ui-bootstrap.js"></script>
 <script type="text/javascript" src="~site/Webparts/testLabApp/testLabApp.js"></script>
 <script type="text/javascript" src="~site/Webparts/testLabApp/dal.js"></script>
 <script type="text/javascript" src="~site/Webparts/testLabApp/email.js"></script>
 <link href="~site/Webparts/testLabApp/style.css" rel="stylesheet" />

然后在App js文件中添加依赖：

var testLabApp = angular.module('testLabApp', ["ngRoute", "ui.bootstrap"]);

但是，我收到注射器错误：

[$injector:modulerr] http://errors.angularjs.org/1.4.2/$injector/modulerr?p0=testLabApp&p1=Error%3A%20%5B%24injector%3Amodulerr...

显然，我做错了什么，但我找不到如何从 github 下载正确的文件。

非常感谢任何帮助。

问候克雷格

【问题讨论】：

标签： angularjs angular-ui-bootstrap

【解决方案1】：

如果你只是使用 modal.js，没有名为 ui.bootstrap 的模块。

尝试改变：

var testLabApp = angular.module('testLabApp', ["ngRoute", "ui.bootstrap"]);

收件人：

var testLabApp = angular.module('testLabApp', ["ngRoute", "ui.bootstrap.modal"]);

确保还下载模态的模板文件（window.html 和 background.html）

【讨论】：

谢谢。我下载了完整的 ui.bootstrap 文件和模板。模态然后工作，但在我的屏幕左下角显示一个框，而不是像我预期的那样在中间。是因为模板文件 - 我在哪里手动安装它们？
@CraigRoberts 在angular-ui.github.io/bootstrap，您可以选择在下载时将模板与 ui-bootstrap 捆绑在一起，让生活更轻松。如果您希望它们分开，我相信将模板/根目录与 JS 放在同一文件夹中应该可以解决问题。还有一个 ui-bootstrap 依赖是 bootstrap CSS，确保你也有 ui-bootstrap 使用的 CSS 类。

【解决方案2】：

看起来问题是你只下载了modal.js，它只是modal部分，而不是ui-bootstrap的全部。

试试这个文件：https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.3/ui-bootstrap.js

或缩小：https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.3/ui-bootstrap.min.js

【讨论】：