能力缺口：拿 Angular 写了页面，却调不通移动端外壳

很多前端转岗或备战的开发者，在学完基础的 Angular 语法后，一上手做跨平台移动应用就卡壳：知道怎么写组件，却不知道怎么把页面塞进手机原生的导航栈里；知道怎么双向绑定数据，但遇到弹窗、列表下拉刷新这类移动端高频交互就不知所措。这门课解决的就是从“能写 Web 页面”到“能调通移动端应用框架”的断层问题。它聚焦于 ionic2 搭配 angular 2 的基础用法，不跟你扯大而全的架构演进，只讲你在这个特定技术栈里立刻就会踩的坑：环境怎么装、项目怎么跑起来、页面怎么声明与调用、基础组件怎么拼装。如果你的技术底子是写过 TypeScript 但没碰过 ionic，或者以前用过 ionic1 现在要迁移，这门课正好缺什么补什么。别假装看两眼文档就能融会贯通，移动端的页面生命周期和路由栈跟纯 Web 不一样，硬啃文档不如跟着实操跑一遍。

建议先看哪几块：环境与项目骨架必须先打通

资料里的练习线索很明确，建议你先死磕第一部分的“安装与配置”以及“项目结构与启动流程”。很多人在这步就放弃，多半是 Node 版本对不上、依赖包下载报错或者模拟器起不来。把项目创建、执行、新增页面这几步跟着敲通，确保本地能跑起一个空白壳子，再去看第二部分的组件用法。组件部分先挑按钮和对话框练手，不要一上来就搞复杂的列表或表单。这些基础组件看似简单，但它们牵涉到 ionic 里特有的注入方式和 angular 的模块声明，调通这几个，你对这套技术栈的运行机制就有了手感。练习时，资料包里的代码片段必须自己手敲一遍，遇到报错先查依赖版本对应关系，别直接跳过报错去抄答案，那样查漏补缺就失去了意义。

学完能独立做什么：从零搭起一个带交互的移动端页面

看完这套资料并跟着练完，你应该能独立完成一个具备基础交互的移动端应用雏形。具体来说，你能从零初始化一个 ionic2 项目，看懂它底层的目录结构和启动逻辑，不再对着满屏文件发懵；你能自主新增页面，配置路由跳转，把多个页面串成一个完整的导航流；你能熟练调用按钮、带图片按钮、alert 弹出框和 confirm 对话框等核心组件，完成用户交互的闭环。遇到需要弹出确认框或者做简单表单提交的场景，不用再去满世界找现成的轮子，自己就能用 angular 2 的数据绑定结合 ionic2 的组件拼出来。备考或面试时被问到这套技术栈的底层机制，你能说清楚页面是怎么声明和挂载的，而不是只背得出几个 API 名字。把基础用法和案例应用吃透，你的能力缺口就补齐了，下一步再去啃更复杂的网络请求和数据持久化，心里就有底了。

课程目录

1-1 [认识ionic2] 什么是ionic2 (09:23)
1-2 [认识ionic2] ionic2的优势 (08:01)
1-3 [认识ionic2] ionic2的安装与配置说明 (08:22)
1-4 [认识ionic2] ionic2项目的创建与执行 (03:36)
1-5 [认识ionic2] ionic2项目结构说明和启动流程 (08:50)
1-6 [认识ionic2] 新增项目中的页面 (09:46)
1-7 [认识ionic2] 新页面的声明与调用 (06:55)
2-1 [ionic2中的组件] 认识按钮组件 (05:22)
2-2 [ionic2中的组件] 带图片的按钮组件 (07:23)
2-3 [ionic2中的组件] alert弹出框组件 (11:00)
2-4 [ionic2中的组件] comfirm对话框组件 (07:21)
2-5 [ionic2中的组件] 卡片组件的介绍 (02:32)
2-6 [ionic2中的组件] 卡片组件的基础功能 (05:42)
2-7 [ionic2中的组件] 卡片组件中的图文混合方式 (07:54)
2-8 [ionic2中的组件] 表单中的输入组件介绍 (02:42)
2-9 [ionic2中的组件] 表单中复选框和单选按钮组件的使用 (06:02)
2-10 [ionic2中的组件] 表单中下拉列表框组件的使用 (06:45)
2-11 [ionic2中的组件] 日期时间组件的使用 (17:30)
2-12 [ionic2中的组件] 表格布局组件的使用 (11:06)
2-13 [ionic2中的组件] 文本输入框组件的使用 (13:52)
2-14 [ionic2中的组件] 列表组件的使用——文字显示 (10:03)
2-15 [ionic2中的组件] 列表组件的使用——图文混合方式显示 (08:39)
2-16 [ionic2中的组件] 加载提示组件的使用 (10:33)
2-17 [ionic2中的组件] 菜单组件的使用 (10:21)
2-18 [ionic2中的组件] 幻灯片组件的使用 (10:51)
2-19 [ionic2中的组件] 信息提示组件的使用 (13:01)
2-20 [ionic2中的组件] 应用的打包与部署 (13:55)
3-1 [案例开发——新闻浏览系统] 需求分析 (07:28)
3-2 [案例开发——新闻浏览系统] 实现技术 (03:54)
3-3 [案例开发——新闻浏览系统] 首页的创建与选项卡的修改 (10:12)
3-4 [案例开发——新闻浏览系统] 首页中UI组件的布局 (11:31)
3-5 [案例开发——新闻浏览系统] 首页中样式布局的微调 (14:09)
3-6 [案例开发——新闻浏览系统] 首页中数据的来源和绑定 (13:59)
3-7 [案例开发——新闻浏览系统] 图片新闻页中UI组件的布局 (18:56)
3-8 [案例开发——新闻浏览系统] 列表新闻页中UI组件的布局 (09:35)
3-9 [案例开发——新闻浏览系统] 新闻详细页的创建 (17:06)
3-10 [案例开发——新闻浏览系统] 页面之间值的传递 (13:09)
3-11 [案例开发——新闻浏览系统] 新闻详细页中UI组件的布局 (11:19)
3-12 [案例开发——新闻浏览系统] 新闻详细页中收藏功能的实现 (20:24)
3-13 [案例开发——新闻浏览系统] 新闻详细页中点评模块的UI组件布局 (16:42)
3-14 [案例开发——新闻浏览系统] 发表点评信息功能的实现 (19:47)
3-15 [案例开发——新闻浏览系统] 上拉加载更多点评信息功能的实现 (12:13)
3-16 [案例开发——新闻浏览系统] 下拉加载首页更多新闻内容的实现 (17:28)
3-17 [案例开发——新闻浏览系统] 项目的打包与发布 (09:57)