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核心api漫谈

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应用中组件化的代表，它是继ngModule后的第二个核心概念:组件。

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需要开发者有一定的英文基础。

具体的ng2构建web应用教程，可以参考如下链接

angular中文社区,github账号