angular4学习笔记一 niceFish架构、angular架构

• 适合新手学习
• 观看大漠的angular2免费视频
• 视频以及代码链接 https://gitee.com/mumu-osc/NiceFish
• 通过学习nicefish代码，快速掌握angular2的架构

---

写在前面

最近在学习angular2，看了看官方文档但是还是感觉不能系统掌握angular，虽然官方讲解的很清晰但是对于我这样的菜鸟来说，不结合具体的项目很难理解每一个技术要点。所以从网上搜到了大漠的良心之作—angular2视频，结合官方文档，感觉效率事半功倍。下面分享一下我的学习记录，大家共同学习，如果有错误还望多批评指正。

NiceFish架构图

上图是的nicefish项目结构图，因为我学习该项目代码只添加了部分模块，所以该结构图只做了部分模块和组件。。、

Angular架构图

模块

总结

1、模块：现在前端框架越来越趋向于模块化、工程化。一个简单的项目可能只需要一个根模块就可以了，但是稍微大一定的项目就需要创建多个模块 。模块为该模块中的组件提供上下文环境。
前端模块化的优点：
①各功能模块解耦、灵活架构
②易于进行测试
③易于分工合作
说到模块，就不由得想起了前端路由和懒加载，哈哈哈
2、组件：模块中包含组件，组件属于哪个模块，必须要在该模块中进行声明。一个组件只属于一个模块。
3、模板：组件配套的html页面
4、双向数据绑定：

双向数据绑定把属性绑定和事件绑定结合

5、service通过依赖注入到组件中