其实说成使用requirejs加载angularjs应用会更贴切一些
<body>
<span ng-controller="homeController">{{resultValue.Msg}}</span>
<script src="js/lib/require.js" data-main="js/main"></script>
</body>
只不过需要手动启动angularjs,同时所有的模块由requirejs来组织并确定依赖关系,这样就能实现按需加载了
/**
* main.js
* 这个文件完成的事情简单来说就是:载入所有文件,然后在document上运行Angular并将ng-app属性设置为’app’。
* 这些文件因为是由RequireJS异步载入,因此我们需要来“手动启动”Angular应用。
*
* */
require.config({
paths: {
//库文件
//"responsive": "lib/responsive-nav",
"angular": "lib/angular",
"bootstrap": "lib/bootstrap.min",
"angularRoute": "lib/angular-route",
"angularResource": "lib/angular-resource",
//"ui-bootstrap": "lib/ui-bootstrap-tpls-0.11.0.min",
//"phprpc": "lib/phprpc_client",
"jquery": "lib/jquery.min"
},
shim: {
angular: {
exports: "angular"
},
angularRoute: {
deps: ["angular"]
},
angularResource: {
deps: ['angular']
}
},
urlArgs: "bust=" + (new Date()).getTime() //防止读取缓存,调试用
});
//手动启动ng
define(["routes"], function () {
//使用bootstrap方法启动Angular应用
angular.bootstrap(document, ["app"]);
});
/**
* routes.js
*/
define([
"app"
], function (app) {
//app是Angular应用对象
app.config(['$routeProvider',
function ($routeProvider) {
$routeProvider
.when('/search', {
templateUrl: 'template/search.html',
controller: 'SearchCtrl'
})
.otherwise({ redirectTo: '/LmpSumQut' });
}]);
})
其他的模块代码略了,看参考链接:
http://blog.csdn.net/yo548720570/article/details/41047309
http://www.open-open.com/lib/view/open1413189699875.html
https://segmentfault.com/a/1190000000492238
http://www.cnblogs.com/kenkofox/p/4643760.html
http://www.tuicool.com/articles/J3INv2Z
http://blog.163.com/liuyong_xiaxia/blog/static/17435525520156341446981/