摘要：
利用angularjs内置的$q服务，类似于es6中的promise，即创建异步加载，在加载完成后返回promise，通过promise来判断是否成功加载js，成功加载之后再赋给controller，程序写在route的resolve里。首先在页面引入ocLazyLoad.js、ui-router.然后建立modulevarapp=angular.module;functionasyncJS{//此处可以将路由异步加载js提到公共部分。
angularjs 异步加载js 有两种方法
第一种 使用$q 和 requireJS 加载
这个问题 首要出现 在 当我 把require 引入 项目中是，希望做到 点击路由时加载相应的页面html和 js.
起初我是将 route 的 controller 设置为 require（‘controller.js’） 来 异步加载，
当然，问题是不可能这么简单的，肯定要出现一些问题。
这样就出现一个问题，当 我路由子页面 中出现 与数据相关的 初始化时，第一次跳转是正常的，此时跳到其他页面，再跳回该页面时 controller的数据 却无法获取。
导致页面空白。
$routeProvider.when('/quick_set', {
templateUrl: 'layout/quick_set.html',
controller: require('quick_set')
})关于这个问题的解决我也看了很多的博客，找到了以下的解决方案。
利用 angularjs 内置的 $q 服务，类似于 es6 中的 promise，即创建异步加载，在 加载完成后返回 promise ，通过promise 来判断是否成功加载js，成功加载之后再 赋给controller，
程序写在 route 的 resolve 里。
1 $routeProvider.when('/quick_set', {
2 templateUrl: 'layout/quick_set.html',
3 controller: 'quick_set',
4 resolve: {
5 loadController: app.asyncJS('quick_set') //在这里 加入 异步请求
6 }
7 })1 app.asyncJS = function(js) {
2 return function($q) {
3 var deferred =$q.defer();
4 require([js], function(controller) {
5 $controllerProvider.register(js, controller); //由于是动态加载的controller，所以要先注册，再使用
6 deferred.resolve(); //将 返回的promise标记为 resolve 状态，即 成功状态，reject 问拒绝状态。
7 });
8 returndeferred.promise;
9 }
10 }这样就成功的解决了这个问题。
第二种 使用ocLazyLoad.js 配合 ui-router 加载。
首先在页面引入 ocLazyLoad.js 、ui-router.
然后建立 module
var app = angular.module('myapp', ['ui.router', 'oc.lazyLoad']);functionasyncJS(js) { // 此处可以将路由 异步加载js 提到 公共部分。 return ['$ocLazyLoad', function($ocLazyLoad) { return $ocLazyLoad.load('/luci-static/resources/modules/controllers/' + js + '.js'); //此为 加载路径 }] } $urlRouterProvider.when('', '/quickSet'); $stateProvider.state('quickSet', { url: '/quickSet', templateUrl: '/luci-static/resources/layout/quickSet.html', controller: 'quickSet', //此处函数名与加载的函数名一致。 resolve: { //在resolve 中 调用 loadController: asyncJS('quickSet') } })
这样当路由执行时，才加载子页面的controller。
子页面的controller 必须以 重新 绑定 app的congtroller 才会生效。
此为 子页面controller 的头部
angular.module('myapp', []).controller('quickSet', ['$scope', '$http', '$log', function ($scope, $http, $log) {}