章 准备工作 .....................................1 1.1 需要了解什么.............................1 1.2 本书结构.....................................1 1.2.1 第 1 部分：准备...................2 1.2.2 第 2 部分：使用 Angular .........42 3.5 理解合并项目和工具................44 3.5.1 理解项目结构.....................44 3.5.2 理解工具集成.....................44 3.5.3 理解项目变更系统..............45 3.5.3 检测 TypeScript 错误...........48 3 ............54 4.2.4 在属性中引用字面量...........55 4.2.5 理解元素内容.....................55 4.2.6 理解文档结构.....................55 4.3 理解 Bootstrap...........................57 4.3.1 应用基本的Bootstrap类..

AddUser NiceFish实例项目的组件树结构 单向数据流 App Home User Role Permission UserList AddUser 单向数据流 https://github.com/modern-javascript/angular2-data-flow 实际项目中的组件树 不可变数据类型 组件树生成器 https://github Angular应用中路由形成的Tree形结构 Angular路由用法：静态路由 Angular路由用法：异步路由 Angular路由用法：路由守卫 防止未授权访问 第三块：Angular架构特色 依赖注入 依赖注入 Parent Injector Child Injector 注射器（Injector） 也是一个树型结构 依赖注入 依赖注入  每

、遍历数据。它只是进 行引用比较。 基于值的脏数据检查： 基于值的脏数据检查：它会进行深度-对象-树比较。这意味着，在每一个 $digest 周期， AngularJS 将检查新老数据是否具有相同的结构。 基于集合的脏数据检查： 基于集合的脏数据检查： 它比较物理对象引用。集合观察者维护了一个对于数组和对象的值复制,在每个消化周期，遍历新旧值，通过===来比较是否 改变。比如，不同于基于引用的脏数据检查， reference check of the top level items in the collection. 脏检查的关键点： 脏检查的关键点： 如果一个模型有2000-3000个观测者，那么系统会变慢 就算你的应用足够快，使用户不会感到相应延迟，你也不能直接在一页上展示2000个信息给用户。因为这是一个很坏的UI设计，用户会感动无所适从，但是， 使用排序组件或者具有双向绑定功能的表格，你能

bootstrap: [ AppComponent ] 19 }) 20 export class AppModule { } NgModule 系统与 JavaScript（ES2015）用来管理 JavaScript 对象的模块系统不同，而且也没有直接关联。 这两种模块系统不同但互补。你可以使用它们来共同编写你的应用。 JavaScript 中，每个文件是一个模块，文件中定义的所有对象都从属于那个模块。通过 import 语句来访问这些公共对象。 架构概览 5 1.2 NgModule 和 JavaScript 的模块 NgModule 系统与 JavaScript（ES2015）用来管理 JavaScript 对象的模块系统不同，而且也没有直接关联。 这两种模块系统不同但互补。你可以使用它们来共同编写你的应用。 JavaScript 中，每个文件是一个模块，文件中定义的所有对象都从属于那个模块。通过 onerror="...">、。如果攻击者所控制 的数据混进了 DOM，就会导致安全漏洞。 3.2.1 Angular 的 “跨站脚本安全模型” 为了系统性的防范 XSS 问题，Angular 默认把所有值都当做不可信任的。当值从模板中以属性（Property）、 DOM 元素属性（Attribte)、CSS 类绑定或插值表达式等途径插入到 DOM

– 通过iframe加载菜单 – 每个功能菜单都是独⽴立界⾯面 – 各功能菜单包含完整的公共库（JS，样式） • 单页应⽤用 – 每个功能都是部件 – 动态加载 – 整个系统共享⼀一个作⽤用域 单页应⽤用架构 前端的分层 • 为什么单页应⽤用⼀一定要分层？ – 前端逻辑有⼀一定规模，分层有利协作 – 便于保证数据的⼀一致性 – 业务逻辑的复⽤用 – 服务、前端业务逻辑 • Angular有哪些特性适合移动端开发？ – ngTouch • 还有更完善的选择吗？ – Ionic 前端的⼯工程化 • ⼀一个软件系统，并不只是简单功能的堆砌 • 当规模扩⼤大的时候，有⼀一些边际效应 – 某个JS模块被修改，如何得知会影响谁？ – 某个界⾯面⽚片段被调整，会影响什么界⾯面？ – 如何最⼩小化发布？