AngularJS 笔记系列(三)模块和作用域
模块:
在 AngularJS 中,将函数代码全部都定义在全局命名空间中绝对不是什么好主意,全局变量污染会使冲突几率变大,调试困难,降低开发效率。上次写计时器的 controller 时,我们把 controller 写在了一个全局命名空间中定义的函数里,这就是反例。在 Angular 中,模块是定义应用的主要方式。模块包含了主要的应用代码。一个应用可以包含多个模块,每一个模块内都包含了定义具体功能的代码。
使用模块的好处有很多:
- 保持全局命名空间的整洁;
- 便于测试;
- 可以复用;
- 使应用可以以任意顺序加载代码各个部分。
定义模块方法:
angular.module('moduleName',[]);
参数:
1. name (字符串)
模块的名称
2. requires (字符串数组)
Angular 的依赖注入机制,数组元素为当前定义模块所依赖的模块名称。
作用域:
作用域(scope)是构成 Angular 应用的核心基础。应用的作用域是和应用的数据模型相关联的,同时作用域也是表达式执行的上下文。$scope 是定义应用业务逻辑,控制器方法和视图属性的地方。
作用域是视图和控制器之间的胶水。在应用渲染并呈现给用户之前,视图中的模板会和作用域进行连接,然后应用会对 DOM 进行设置以便将属性变化通知给 AngularJS。这个功能让 XHR请求等 promise 对象的实现变得非常容易。
$scope 是可以嵌套的,在子$scope中我们可以引用父$scope 的属性,就像 JavaScript 一样。这个分层就是,当我们为子级 DOM 元素创建了一个新的作用域时,其实也是为子元素创建了一个新的执行上下文。
作用域提供了监视数据模型变化的能力,我们可以使用 $apply 机制,将数据模型的变化在整个应用范围内进行通知。
$rootScope 是 Angular 中最接近全局作用域的对象。所以不要在它上面附加太多业务逻辑,这跟污染全局作用域是一样的。
$scope 就是一个JavaScript对象,我们可以为它添加或者删除属性,他的所有属性都可以自动被视图访问到。它是视图和控制器之间的胶水,也是视图与 HTML 的桥梁。
生命周期:
创建:在创建控制器或者指令时,AngularJS 会同时用$injector 创建一个新的作用域,并在指令或者控制器运行时将该作用域传递进去。
链接:当 Angular 开始运行时,所有的$scope 对象都会附加或者链接到视图中。所有创建$scope 对象的函数也会将自身附加到视图中。
这些作用域将会注册当Angular 应用上下文变化时需要运行的函数。
更新:事件循环运行在$rootScope上,在每个子作用域中进行脏值检查,发现任意变化,即可执行相应的回调函数。
销毁:当一个$scope 在视图中不再被需要时,他将被销毁。
The Only Way To Do Great Work Is To Love What You Do.
Myths Are Public Dreams While Dreams Are Personal Myths.