AngularJS模块
标签(空格分隔): AngularJS
AngularJS框架在window对象下新增了一个全局的angular对象,可以通过调用angular对象的module方法来返回一个模块实例:
//定义一个无依赖的模块
angular.module(‘appModule’,[]);
//定义一个依赖另外两个模块的模块
angular.module(‘appModule’,[‘module1’,’module2’]);
angular.module()方法可以接受三个参数,第一个为模块名,第二个指定该模块依赖的模块名称,第三个参数接受一个方法,用于对模块进行配置,和模块实例的config方法等同。
angular.module()方法返回一个模块实例对象,我们可以使用该对象的controller(),directive(),filter()等方法向该模块添加控制器,指令和过滤器等其他组件。
模块定义完后,通过 来为HTML页面添加对此模块的引用。
使用模块解决命名冲突的问题:
先编写一个登陆页面:
登录页面
这个页面中它引用了common.js文件,也引用了UserController的控制器,这个控制器定义在JS文件中。
下面定义一个注册页面:
注册页面
这个注册页面也引用了同一个JS文件中控制器,如果这两个文件所属于同一个模块中,则在执行到
var loginModule = angular.module(“loginModule”,[]);
loginModule.controller(“UserController”,function(
$scope.uname = "login";
$scope.pword = "admin";
$scope.submit = function() {
alert("登录模块:UserController");
}
});
var registerModule = angular.module(“registerModule”,[]);
registerModule.controller(“UserController”,function(
$scope.submit = function() {
alert(“注册模块:UserController”);
}
});
分别创建了两个模块实例和定义了每个实例下的控制器。