架构概述
Angular应用的基本构建模块是 NgModules ，它为组件提供编译上下文。Angular 应用程序由一组 NgModules 定义，至少有一个根模块，一般叫做 AppModule ，还有更多的特性模块，使应用程序可以模块化开发。
- 组件定义视图
- 组件使用服务
组件和服务都是类，使用 装饰器 标记其类型并告知 Angular 如何使用元数据。
- 组件类的元数据将 组件 和展现视图的 HTML以及样式 关联起来。
一个应用程序由很多组件组成，类似于倒装的树结构，一个根组件，向下分叉，下图所示。结合Angular 提供的 Router 服务，就可以定义视图之间的导航路径。
模块
NgModule 为组件、服务的编译提供上下文环境，形成功能单元。我们可以将常用的组件、服务放到一个 CommonModule 中，在别的模块中导入 CommonModule ，形成自己的组件库，快速开发，形成技术沉淀。
每个应用都有一个根模块，一般叫做 AppModule，根模块提供了引用启动的引导机制。
Angular 的模块化提供了 惰性加载功能，这项技术可以减少启动应用需要加载的代码量，让应用快速展现。
组件
组件是一个类，使用 @Component 装饰器修饰。包含数据和逻辑，并与一个模板文件关联，用于视图展示。
模板、指令和数据绑定
模板是用来展示 HTML 得，在模板中，可以使用 Angular 提供的指令、数据绑定功能。指令提供程序的逻辑，绑定标记 把应用数据 和 DOM 关联。有2种类型的数据绑定：
- 事件绑定
- 属性绑定
在视图展示之前， Angular 会根据应用数据和逻辑来运行指令和解析绑定表达式，修改HTML 元素 和 DOM。Angular 支持双向数据绑定，在 DOM 中发生的数据变化可以同步到程序数据中。
在模板中可以使用 管道 方便的格式化数据。比如时间、货币管道等。
服务和依赖注入
这些概念和 Spring 中的概念很类似，Angular 参考了后台开发的思想，解决了 JS 在编写复杂业务逻辑的局限性，使编写大型的程序 JavaScript 程序成为可能。在代码的可读性、项目的规范性上有极大的优势。
服务类的创建需要 @Injecable() 装饰器类修饰，可以让你的服务作为 依赖注入到组件中。
依赖注入可以让你的类保持 精简 和 高效，复杂的业务逻辑写到服务中去，做到 解耦 和 方便编写测试程序。
路由
路由服务是由 Angular 的 Router 服务提供的，可以定义在不同的路径下展示的组件。工作模型基于浏览器导航约定：
- 在地址栏输入 URL，浏览器会导航到相应的页面。
- 在页面中单击链接，可以跳转到新页面。
- 点击浏览器的前进 和 后退 按钮，可以在浏览历史中前进和后退导航。
惰性加载功能是由 Router 提供的，当 路由器发现当前的应用状态需要特定的模块，而该模块还未被加载，路由器就会按需加载该模块。
想让 路由器 能正常工作，需要定义导航规则，把路径和组件对应起来。还需要在 NgModule 中声明导航规则。如下图：
总结
- 组件和模板共同定义了视图
–组件上的装饰器包含了指向模板的地址
–组件模板上的指令和绑定标记可以修改视图 - 依赖注入器为组件提供服务
