angularjs应用延迟加载 [英] Lazy load of angularjs application
本文介绍了angularjs应用延迟加载的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我需要的是引导AngularJs和渲染需求指令。想象一下，有一个醒目，不应该是资源大户（不应该在底部多下载，而不需要，甚至和JavaScript将是坏）。
＆LT;！DOCTYPE HTML＆GT;
＆LT;身体GT;
＆LT;按钮的onclick =loadTheApp（）＆gt;启动应用程序和LT; /按钮＆GT;
＆LT;脚本＆GT;
功能loadTheApp（）{
//负载角和其他文件，以这种方式：
VAR EL =使用document.createElement（'脚本'）;
el.src ='/js/app.js';
document.body.appendChild（EL）; // TODO：引导角和渲染指令
}
＆LT; / SCRIPT＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
解决方案
我想你可以使用此解决方案：
el.onload =功能（）{
VAR元= document.body的; //其中包含角应用元素 angular.bootstrap（元素，['对myApp']）;
}
假设app.js文件中包含的角度和应用程序（内部版本），或角被加载并app.js文件包含应用程序对myApp
What I need is to bootstrap AngularJs and render a directive on demand. Imagine there is a splash page that should not be resources-hungry (should not download much without need, even javascript at the bottom would be bad).
<!DOCTYPE html>
<body>
<button onclick="loadTheApp()">Launch app</button>
<script>
function loadTheApp() {
// load Angular and other files in this manner:
var el = document.createElement('script');
el.src = '/js/app.js';
document.body.appendChild(el);
// TODO: bootstrap Angular and render directive
}
</script>
</body>
</html>
解决方案
I think you can use this solution:
el.onload = function() {
var element = document.body; // element which contains angular application
angular.bootstrap(element, ['myApp']);
}
assuming that app.js file contains angular and application (build version), or angular is loaded and app.js file contains application myApp
这篇关于angularjs应用延迟加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
