AngularJS 实现按需异步加载

习惯了 seajs 的异步加载方式，也想着 angular 也能同样使用异步加载，但是事实不随人愿。

angularjs 和 requirejs 一样，使用的是预先加载的方式组织模块（这和 seajs 的懒加载正好相反），当一个单页面应用的模块越来越多时，也就意味着需要预加载的模块也会越来越多，这也许也就说明了 angular 更适合用来开发轻应用。

---

正式开始

路由我使用了angular-ui-router，模块加载器是 requirejs

//路由
{
    state : 'login',
    templateUrl : 'login/login.html',
    controller : 'loginCtrl',
    resolve: {
        realCtrl : function ($q) {
            var def = $q.defer();
            require(['/features/login/login.js'], function (loginCtrl) {
                def.resolve(loginCtrl)
                $rootScope.$apply();
            });
            return def.promise;
        }
    }
},

// 获得$controllerProvider
app.config(function($controllerProvider) {
    app.registerController = $controllerProvider.register;
    // ...
})

// loginControler
app.registerController('loginCtrl', function ($scope) {
   // do something
});

参考

angular应用如何实现按需加载