《AngularJS深度剖析与最佳实践》笔记: 第二章 概念介绍
第二章 概念介绍
2.1 什么是UI?
- 用户界面包括内容(静态信息+动态信息), 外观, 交互. 在前端技术栈中分别由HTML, CSS和JS负责. 进一步抽象, 分别对应于MVC三个主要部分: Model, View和Controller
- 对应到AngularJS中,
- 内容:
- 静态内容---模板
- 动态内容---scope
- 交互---Controller
- 外观
- CSS----样式
- filter----格式
- 内容:
2.2. 模块(module)
- 模块: 把相关的一组编程元素(如类, 函数, 变量等)组织到同一个发布包中. 这些编程元素之间紧密协作, 隐藏实现细节, 只通过公开的接口与其他模块合作
- 解决模块之间的依赖关系.
- 引用模块:
angular.module('com.ngnice.npp')
- 创建模块:
angular.module('com.ngnice.npp', ['common']) //第二个参数是数组, 声明所依赖的模块
-
模块依赖关系是一棵树, 凡是依赖了app模块的更高级模块, 也会自动依赖app所依赖的common模块
2.3 作用域(scope)
- AngularJS中, scope通过原型继承的方式被组织成了一棵树, 根节点是$rootScope, 这是Angular在启动时自动创建的, 通过对应于ng-app指令, 并关联到ng-app所在节点
- scope是Angular解耦业务逻辑层和视图层的关键: Controller操作scope, View展现scope的内容. 传统前端程序中大量复杂的DOM操纵逻辑都被转变成对scope的操作
2.4 控制器(Controller)