ng2-tutorial各个分支，技术细节讲解
Opened this issue · 0 comments
ng2-tutorial技术讲解
ng2综述
ng2的rc版本和今年9月中旬发布的2.0.0正式版本，在核心**上面是有些变动的。
为了降低原来使用angular1的开发者切换到angular2的成本。
谷歌angular2团队在架构angular2的过程中，在权衡纯components组件化开发还是ngModule system之间的比重上面做了不少妥协。
个人的项目开发体会
确实，我在写ng2-tutorial的过程中，内心还是有些感慨的。
毕竟自己是angular2在rc-1版本的时候就开始使用了，所以最近在迁移正式ng2版本的过程中，要重写几乎原来的1/5代码，代价比较大。
不过，angular2的正式版本相比rc版本，在开发理念上面充分照顾了国内的angular1开发者，
除了纯typescript语法外，angular2在原来的模块体系上增加组件化开发的概念，优化了路由体系及解析算法，同时在多处引入了按需加载的概念。
在此，笔者还是推荐国内的开发者将angular1迁移到angular2，虽然迁移成本比较高，但是worth it。
ng2-tutorial各个分支学习讲解
ngModule
NgModule的概念
NgModule是angular2应用中最topLevel的概念，它将angular应用划分为紧密连接的函数模块。
NgModule的使用
1.所有的ng2模块都是一个通过 @NgModule装饰的类。
2.@NgModule接受的参数是一个元数据。
3.这个元数据的作用是指导angular2 compiler如何处理angular 模块。
4.这个元数据的主要key值包括如下(由于英文解释比较迂回，笔者进行了二次解释)。
- providers :定义模块的依赖注入
- declarations : 定义模块内部需要依赖的directives pipes
- imports : 引入模块解析必须依赖的directives pipes
- exports :导出模块间互通的directive等接口
- entryComponents : 入口组件，在声明定义时就会进行编译
- bootstrap : 初始化的模块，默认会自动加入entryComponents数组
这个通过@NgModule定义出来的module，使用bootstrapModule方法运行后，即可完成ngModule分支搭建的小型angular2应用。
Components
Components的概念
Components是angular2应用中组件化的代表，它将ng模块划分为不同的组件块.
Components的使用
1.类似NgModule，所有的ng2组件都需要@component来定义
2.@component接受的参数是一个元数据。
3.这个元数据的作用是指导angular2 compiler如何处理angular组件。
4.这个元数据的主要key值包括如下
- template :组件字符串,可以通过require('html')的形式引入，配合webpack的raw-loader来处理。
- styles : 组件字符串样式数组,同样通过require('css/less/scss')。
- viewProviders : 组件template依赖的directive等片段化对象。
这个通过@components定义出来的Components，使用export class的形式，即可被一个angular模块添加到@NgModule的declarations里面，完成它加载进ngModule的使命。
Router
Router的概念
Router是angular2应用中对比市面上的react-router等比较出色的路由，直观而易用。
Router的使用
1.在使用Router的时候，需要将RouterModule添加进ng2模块的imports，提供模块的路由指令。
2.Router支持嵌套路由，异步加载，场景转换等。
3.router-outlet 是angular2渲染组件路由的路标系统，相关path对应的component会查找它并渲染。
4.一个基本的Router配置数组如下:
- path : 即路径，类似location.path
- component : 相关path需要加载的组件
- children : 子路由
总结
angular2的开发模式遵守严格的规则，这样可以让开发者都依循它的设计理念来开发业务模块。
对于熟悉angular1的开发者而言，迁移到angular2的主要成本在于typescript和components**的转变。另外，国内关于ng2的论坛和相关资料也比较少，使用ng2需要开发者有一定的英文基础。