Load modules on demand (lazy load) in AngularJS
17 people use it
Author: 265378?v=3 ocombe


Load modules on demand (lazy load) in AngularJS

Key features

  • Dependencies are automatically loaded
  • Debugger friendly (no eval code)
  • The ability to mix normal boot and load on demand
  • Load via the service or the directive
  • Use the embedded async loader or use your own (requireJS, ...)
  • Load js (angular or not) / css / templates files
  • Compatible with AngularJS 1.2.x/1.3.x/1.4.x


  • Put ocLazyLoad.js into your project

  • Add the module oc.lazyLoad to your application (you can install it with bower install oclazyload or npm install oclazyload)

  • Load on demand: With $ocLazyLoad you can load angular modules, but if you want to load any component (controllers / services / filters / ...) without defining a new module it's entirely possible (just make sure that you define this component within an existing module).

There are multiple ways to use $ocLazyLoad to load your files, just choose the one that you prefer.

See the example in the 'example' folder to know how to integrate ocLazyLoad with your router.

comments powered by Disqus
This page was last updated over 3 years ago.