Angular 2 实践纲要

Angular 2 实践纲要

目前Angular 2项目的工程搭建有三种方式：

1、首推 Angular -CLI

因为使用简单，功能强大而方便，详情参考Angular -CLI

ng 三部曲

// 新建工程
ng new [project-name]

//启动本地开发
ng serve 

// 构建生产环境
ng build --prod

2、使用 angular-seed 作为基础工程

// 克隆工程并定位至工程目录
git clone --depth 1 https://github.com/mgechev/angular-seed.git
cd angular-seed

// 安装依赖
npm install

// 开启本地服务，预览工程开发
npm start

// 构建未压缩的开发环境代码
npm run build.dev

// 构建生产环境代码
npm run build.prod

3、自己手动搭建工程目录和自动化编译工具等

1、Angular -CLI 快速起步（耗时最多1个小时）

Angular -CLI 快速起步

angular-cli 命令参考

【Angular -CLI 快速起步】能够达到以下目的：

设置开发环境

创建新项目以及应用的骨架

启动开发服务器

编辑该应用

2、使用Angular-CLI 新建工程 开发一个 英雄列表项目

2.1、构建本地开发环境

2.2、多组件开发

2.3、使用服务（service）

2.4、使用路由（router）

2.5、使用Http

2.6、生成环境构建部署

3、使用Angular 2 做一个后台内容管理系统

3.1、搭建项目工程

3.2、登录表单(login)

3.3、仪表盘(dashboard)

• 头部导航
• 侧栏
• 底部
• 内容布局
• 面包屑

3.4、组件

- 常用组件

4、深入学习Angular 2 核心概念与TypeScript

5、优化应用进一步进阶