详解基于angular路由的requireJs按需加载js

最近终于不忙了！！有时间沉淀一下之前学到的angular东东！！

angular路由想必大家已经不陌生了！（陌生的去看我之前那篇手把手教你配置angular路由！）

angular路由作为单页面应用，切换页面的时候都是一个页面，所以切换controller和按需加载控件js就成了大问题！！折腾了我半天啊，angular-route内置的办法也没有解决这个问题，最终我是用requireJs解决的这个问题！！上代码！

1.首先引入requireJs，并且在它的下面用闭包写配置 requirejs(['framework'])，这句话的意思是首次进入页面，加载framework

<script src="js/lib/require.min.js"></script> <script>   (function () {     var jsDir = '/js/';     var jsLibDir = '/js/lib/';     var jsComponentDir = '/components/';     var paths = {       angular: jsLibDir + 'angular.min',       angularRoute: jsLibDir + 'angular-route.min',       jquery: jsLibDir + 'jquery.min',       jQueryMD5: jsLibDir + 'jquery.md5',       highcharts: jsLibDir + 'highcharts',       radialProgress: jsLibDir + 'radialProgress',       d3: jsLibDir + 'd3.min',       echarts: jsLibDir + 'echarts',       framework: jsDir + 'framework',       angularUtil: jsDir + 'angular-util',       standardDashboard: jsDir + 'standard-dashboard',       standardConsole: jsDir + 'standard-console',       standardAmountStatistic: jsDir + 'standard-amount-statistic',       standardReport: jsDir + 'standard-report',       standardAdvancedReport: jsDir + 'standard-advanced-report',       standardExpertAnswer: jsDir + 'standard-expert-answer',       standardService: jsDir + 'standard-service',       standardStrategyInform: jsDir + 'standard-strategy-inform',       standardMember: jsDir + 'standard-member',       standardSchedule: jsDir + 'standard-schedule',       standardChannel: jsDir + 'standard-channel',       standardStrategyMerge: jsDir + 'standard-strategy-merge',       standardIntegrate: jsDir + 'standard-integrate',       standardPersonalCenter: jsDir + 'standard-personal-center',       dateTimePicker: jsComponentDir + 'dateTimePicker/date-time-picker',       fullCalendar: jsComponentDir + 'fullCalendar/fullcalendar',       moment: jsComponentDir + 'fullCalendar/moment'     };          requirejs.config({       paths: paths,       shim: {         angular: {           exports : 'angular',           deps: ['jquery']         },         angularRoute: {           deps: ['angular']         },         jQueryMD5: {           deps: ['jquery']         }       },       //urlArgs: "timeStamp=" + (new Date()).getTime()       //urlArgs: 'v=1.47.1&t=20160719'     });     requirejs(['framework']);   }()); </script> 

2.framework.js作为首次加载的js，起到至关重要的作用哈！！定义frameworkApp模块作为主模块，另外加载公共服务utilmodel和ngRoute路由，定义一个resolveController方法，回调函数是requireJs，一会儿会讲到！