使用 angular 写程序的开发都知道，要想使用 angular 应用能够运行，需要在页面中 “登录” 它，我们常用的方法是这样的：
<!DOCTYPE html> <html ng-app='myApp'> <head> <meta charset='utf-8'> <script src='angular.js'></script> </head> <body> <div id='text' ng-controller='myCtrl'></div> <script> var app = angular.module("myApp",[]); app.controller("myCtrl",function($scope){ console.log(1); }) </script> </body> </html>
使用 ng-app 指令，让 angular 知道我们在调用它。
除了这种指令调用外，还有另一种 js 文件的启动方式，就是使用 angular 自带的 bootstrap 方法来实现启动，省却了页面中的 ng-app 指令。
like this：
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <script src='angular.js'></script> <script src='jquery-1.11.3.js'></script> </head> <body> <div id='text' ng-controller='myCtrl'></div> <div id='text2' ng-controller='myCtrl2'></div> <script> var app = angular.module("myApp",[]); app.controller("myCtrl",function($scope){ console.log(1); }) var app2 = angular.module('myApp2', []); app2.controller('myCtrl2', function ($scope) { console.log(2); }) $(document).ready(function () { angular.bootstrap($('#text'), [app.name]); angular.bootstrap($('#text2'), [app2.name]); }); </script> </body> </html>
这样，我们可以定义多个 module 来执行不同的功能，自己在自己的作用域中，不会出现一个大 module 里好多变量名称，而且也不会出现变量污染的情况，怎么样，是不是很 fashion ？