In a previous post I showed how to combine RequireJS AMD with regular Angular DI. In this post I will demonstrate how to enhance this further by adding ocLazyLoad to support true on demand lazy loading of resources.
The advantage to using ocLazyLoad is that it enables us to support lazy loading at the module level, which isn't supported in Angular by default. This greatly simplifies things if you want to retrofit lazy loading into an existing Angular application. Basically all you have to do is wire in some pluming to wrap your top level module files, but luckily we don't have to touch downstream resources like controllers, services and directives.
Here's the link to the sample app
The code can be found below:
As you can see, the main module is pretty much like any Angular app module, with the exception of the resolve based ocLazy calls needed to bring in modules at runtime.
There you have it! Lazy loading in Angular via RequireJS and ocLazyLoad on top of Angular DI.
I have uploaded the code to Github