如何正确加载 AngularJS 引导模块？答案

【问题标题】：How do I load AngularJS bootstrap module correctly?如何正确加载 AngularJS 引导模块？
【发布时间】：2013-04-04 07:12:46
【问题描述】：

在我的 Rails 应用程序中，ui-bootstrap-0.2.0.js 位于 vendor/assets/javascripts 目录中。我在我的application.js 文件中需要该文件。

当我在这一行中将引导程序指定为我的依赖项时，angular.module('myApp',['ui.bootstrap']); 出现错误，按照此处的说明进行操作，http://angular-ui.github.io/bootstrap/

Chrome 在此定义的模块中检测到 Uncaught ReferenceError: angular is not defined： angular.module("ui.bootstrap", ["ui.bootstrap.accordion", ...]) 在ui-bootstrap-0.2.0.js。

但是，angular.js 捕获到错误 No module:ui.bootstrap。所以这两个javascript文件似乎都看不到彼此。这个问题有方法解决吗？

【问题讨论】：

你是否包含angular.js 之前引导？
是的，我确保在引导之前加载了 angular.js。
我对 Rails 的资产管道不是很熟悉。文件是异步请求的还是 Rails 生成了 script 标签？也就是说，是否有最终输出可供查看以了解发生了什么？
Rails 在开发中生成生成的脚本标签。
那么 Rails 对它们的排序不正确。查看 jpmorin 对他的回答的评论。

标签： ruby-on-rails twitter-bootstrap angularjs

【解决方案1】：

这是我在项目中的做法：

<script type="text/javascript" src="libs/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="libs/jquery-ui-1.10.2.custom.min.js"></script>

<script type="text/javascript" src="libs/angular.min.js"></script>
<script type="text/javascript" src="libs/angular-ui.min.js"></script>
<script type="text/javascript" src="libs/angular-resource.min.js"></script>

<script type="text/javascript" src="libs/ui-bootstrap-tpls-0.2.0.min.js"></script>

<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/services.js"></script>
<script type="text/javascript" src="js/directives.js"></script>
<script type="text/javascript" src="js/filters.js"></script>
<script type="text/javascript" src="js/controllers.js"></script>
<script type="text/javascript" src="js/utils.js"></script>

这就是我设置应用程序模块的方式：

var app = angular.module('myapp', ['ui.bootstrap','ngResource']);

【讨论】：

我可能会像你一样手动完成，但我希望我可以在我的 Rails application.js 中使用// require bootstrap_file 来要求它，然后通过加载应用程序来加载我的所有 js 文件.js
这篇文章对您有帮助吗？ stackoverflow.com/questions/6149961/…