发布于 2017-02-02 03:19:00 | 54 次阅读 | 评论: 0 | 来源: 网友投递
这里有新鲜出炉的AngularJS Tutorial中文版，程序狗速度看过来！
AngularJS 前端JS框架
AngularJS诞生于Google是一款优秀的前端JS框架，已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是：MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入，等等。
1.起因
自己一直做winform，有幸从某个大神手里接了一个node.js,express,angularJS等集众多开源框架的一个项目，赶鸭子上架，于是一边学习，一边用自己以往的思中去整理，重构代码；
2.问题
在某几个环境下，需要用BootStrap的模态框，咱是学win的么。。 自然而然的想到将boosStrp的模态框整成一个通用的东西，四处调用 。。。
于是用patial引用对话框文件，对话框本身用anglurJS进行了服务器相关的通讯 。
后来发现，当只用一个的时候是好用的，如果多次引用 （调用不同的数据）那么只有一个好使。。
3.分析
查了一些资料才明白， angular.bootstrap 这个调用在页面上只能执行一次，多执行就不好用了，而我之前将所有的angular.module都写成了单独的JS文件中，每一个JS文件最后都调用了 angular.bootstrap 所以，自然而然的会挂掉；
4.期待
于是，想有一种解决机制，让我可以随意的partial各种文件到页面中， 并且js文件之间不会重复引用 ，angulurJS也能完美执行；
5.解决
亲们——虽然这个方式有点恶心，但是绝对直接有效；
思路就是把所有的AngularJS模块动态维护在一个全局数组，然后进行动态的加载
不说了，贴代码
在框架页（layout ...)head处引用 angulurinit.js文件，代码如下：
Array.prototype.indexOf = function (val) {
for( var i = 0; i < this.length; i++) {
if(this[i] == val) return i;
}
return - 1;
};
var jsModules = new Array();
function Confirm(val){
if (jsModules.indexOf(val) > -1)
return;
else
jsModules.push(val);
};
将每一个anglur.js模块内的
angular.bootstrap(document, [modulename]);
替换成
Confirm(modulename);
在layout（布局页？我也不知道叫啥，反正是那个公共的框架页）尾部加入angulur.js文件，代码如下：
(function () {
var app = angular.module('app', jsModules);
angular.bootstrap(document, ['app']);
})();
嘿嘿~~ 我恶心了。。。 恶心到您了没？
以上所述就是本文的全部内容了，希望大家能够喜欢。