Question

我想在dom加载时手动引导我的角度应用程序但是当我尝试等到dom加载时，Angular似乎无法引导我的应用程序

 <body>
 <div ng-app="myApp">
  {{1 + 1}}
 </div>
 <script src="angular.js"></script>
 <script type="text/javascript" src="delay.js"></script>

</body>

这是延迟.js

window.onload = function(){
console.log('reached 2')
var myApp = angular.module('myApp',[])
}

console.log('reached 1')

以上代码抛出以下错误。

reached 1 
Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify th...<omitted>...0) 
reached 2

在查看了各种其他示例之后，当我在window.onload事件之外执行此操作时，bootstrapping似乎无缝地工作。

delay.js

//this bootstrap works 
angular.module('myApp',[])
console.log('reached 1')

不确定这里发生了什么，在onload回调期间模块是否对角度不可见？

进一步甚至在delay.js中的以下内容

//still fails to bootstrap     
angular.element(document).ready(function(){
    console.log('reached 2')
    var myApp = angular.module('myApp',[])
    })

即使以下情况也无效

angular.element(document).ready(function(){
console.log('reached 2')
angular.bootstrap(document,[myApp])
var myApp = angular.module('myApp',[])
})

OR

angular.element(document).ready(function(){
console.log('reached 2')
var myApp = angular.module('myApp',[])
angular.bootstrap(document,[myApp])
})

或者甚至

angular.element(document).ready(function(){
angular.bootstrap(document.body.children[0],['myApp'])
var myApp = angular.module('myApp',[])
console.log('reached 2')
})

Answer 1

AngularJS在DOMContentLoaded上自动引导自身。 DOM准备就绪后会立即触发此事件。这意味着如果您需要的只是DOM准备就绪，您不必手动引导您的应用程序。

window.onload事件会等待加载所有内容。这包括所有脚本，图像和其他资源。

如果您仍想在ready上手动引导，请执行以下操作：

angular.element(document).ready(function() {
    angular.bootstrap(document, ['myApp']);
});

angular.bootstrap将在指定的元素上为您创建应用。在这种情况下document。这意味着如果您手动引导应用程序，则不需要ng-app指令。（请注意，我首先错误地认为你仍然需要它。）

您无法在准备好的回调中使用模块声明，因为stated in the developer guide：

“请注意，angular.bootstrap不会动态创建模块。你必须先创建任何自定义模块，然后再将它们作为参数传递。“

这是一个更正的小提琴，表示手动引导时不需要ng-app：http://jsfiddle.net/Yxaba/

Angularjs手动引导程序

1 个答案: