Angular 4 + Webpack 4

Angular 4 + Webpack 4 Demo

https://github.com/saoraozhe3hao/angluar4Demo

npm install

npm install -g webpack-cli

npm run webpack-server

访问 http://localhost:8080/

Angular 与 AngularJS

AngularJS = AngularJS 1.x

Angular = Angular 2+ ，Angluar4兼容Angular2

AngularJS中子组件scope会继承父组件scope的字段，子组件中可以改变父组件的字段，脏检查时会出现循环往复。Angular2 编译器为每个组件自动创建各自的变化检查器，每次检查都是单向的。
Angular使用Zone.js包裹了原生的setTimeout，addEventListener、promise等异步操作，并setup了相应的钩子。异步回调时触发相应钩子，通知angular2做相应的脏检查处理，不用$scope.$apply()。

Angular 4

组件初始化生命周期
constructor -> ngOnChanges -> ngOnInit -> ngDoCheck -> ngAfterContentInit -> ngAfterContentChecked -> ngAfterViewInit -> ngAfterViewChecked -> ngOnDestroy
组件更新生命周期
ngOnChanges -> ngDoCheck -> ngAfterContentChecked -> ngAfterViewChecked
框架模块
@angular/core @angular/common @angular/forms @angular/http @angular/router
项目结构
index.html -> main.ts(入口文件) -> app.module.ts(主模块，应用模块) -> app.component.ts(根模块) -> 特性模块 -> 共享模块