因为有很多文章展示了如何加载指令、服务和其他使用模块这个词来描述它们的角度组件......最终导致了一场 SEO 噩梦。
所有解决方案都非常复杂,使得划分JS文件几乎无关紧要。
有没有人找到一种简单的方法,在需要时将角度模块依赖项注入主模块?
注意:由于我使用的是require.js因此实际的JS已经存在(在需要时也延迟加载)。因此,真正需要的只是将模块注入到角度上。
这是我接近的程度:
索引中的窗口函数.html加载辅助.js文件
<script type="text/javascript"> var hasBackLoaded = false; function loadBackOfficeJs (cb) { console.log("loadBackOfficeJs"); if(!hasBackLoaded){ var newScript = document.createElement('script'); newScript.type = 'text/javascript'; newScript.src = '<%=dist_cdn%>/scripts/back.js'; newScript.onload = backLoaded; document.body.appendChild(newScript); function backLoaded(){ console.log("back loaded") hasBackLoaded = true; cb(); } } else { cb(); } }
调用前面的函数并尝试将 angular 模块加载到 angular 中
loadBackOfficeJs(function(){ require(['back'], function(){ //angular modules should be injected here.. somehow }); });
你应该看看这个lib ocLazyload
最基本的用例是通过提供的$ocLazyLoad服务加载模块。
$ocLazyLoad.load('yourModule.js');
这篇文章是由库的作者在创建库时写的。虽然现在有点旧了,但它是延迟加载模块内部的一个很好的切入点。