Ale*_*ura 6 coffeescript jsfiddle angularjs
我真的不明白为什么有必要angular.bootsrap document, ['MyApp']在我的CoffeeScript代码的末尾做一个管理以下测试应用程序中的模块和控制器的代码:
这是HTML:
<div ng-app='InventoryModule' ng-controller='InventoryController'>
<ul ng-repeat='item in items'>
<li>{{item.title}}</li>
<li>{{item.price | currency}}</li>
</ul>
</div>
还有CoffeeScript:
inventoryModule = angular.module 'InventoryModule', []
inventoryModule.factory 'Items', ->
items = {}
items.query = () -> [{title: 'Hello', price: '5'}]
items
inventoryModule.controller 'InventoryController', ($scope, Items) ->
$scope.items = Items.query()
angular.bootstrap document, ["InventoryModule"]
如果删除最后一行,则应用程序将无效.这是为什么？其他任何地方都没有真正解释过.
这是代码的小提琴:http: //jsfiddle.net/dralexmv/8km8x/11/
正如您所看到的,应用程序确实有效.如果你删除bootstrap它将停止工作.
Ste*_*wie 15
将jsFiddle中的第二个下拉列表设置为"No wrap - in <head>",您将不需要angular.bootstrap行.
当加载Angular库时,它将扫描DOM以查找带有ng-app指令的元素.当它找到一个它将开始自举过程.
在那个过程中,Angular将获取ng-app属性的值(在你的情况下是InventoryModule),并将尝试找到具有相同名称的角度模块.如果它失败了它将抛出:Uncaught Error: No module: <module name>.
在你的小提琴中你已经将"Code Wrap"选择框设置为"onLoad".这个下拉菜单指示jsFiddle何时初始化你放在JS框架中的JS代码.当它设置为"onLoad"时,代码将在onLoad窗口事件中运行.
另一方面,Angular引导过程将继续运行$(document).ready(),并且因为$().ready事件在"onLoad"事件之前被触发,所以Angular将尝试InventoryModule在模块被定义之前初始化模块,这就是"No module"抛出可怕错误的地方.
angular.bootstrap()是一种手动方式来做同样的事情,Angular已经在它的$().ready()处理程序中做了.