Angular浅入深出系列 - 写在前面

简介:
本系列目录:
  • 写在前面
  • 基础知识
  • 控制器(Controller)
  • 作用域(Scope)
  • 集合(Collection)
  • 模块(Module)
  • 依赖注入(Dependency Injection)
  • 服务(Service)
  • 过滤器(Filter)
  • 指令(Directive)
  • 指令作用域(Directive Scope)
  • 路由(Routing)
  • HTTP
  • 总结
很久之前就开始着手准备Angular教程,但苦于一直没有找到合适的切入点。前一段时间,和朋友聚餐时,听几位前端开发Leader朋友都在抱怨,"Angular就是个强大的奇葩,学习曲线高,但奇迹的是团队竟然在稀里糊涂的状态下就完成开发,效果还不错... "、"Angular里面最让人不知所措的就是各种概念,不过熟悉了也就那样,挺简单的..."、"要是有一本小册子能够用最少的篇幅,讲讲Angular里面的故事那应该挺不错的..."

回想起自己刚入手Angular时的感受,切入点就有了!从事前端开发有好几年了,甚至自己也开源过几个框架,但一开始阅读Angular源代码时,还是被一个个"奇怪"的专有名词搞得头昏脑涨,无奈最终还是先去Angular官方文档一个个地去了解这些专有名词是什么,有什么作用。本系列教程将通过对Angular概念的讲解,让大家通过大量的例子了解如何使用这些概念,更重要的是了解Angular引入这些概念是为了解决什么问题。

Angular:易用还是难用?

为什么要提到这个话题呢?现实中每个前端项目在进行技术选型时,都会面对选择什么样的技术架构进行开发这个问题。说个题外话,几年前和朋友探讨这个问题时,大家都会不约而同的将技术架构和框架等同起来,也就是说"前端项目架构==框架"。现在随着前端架构的价值逐渐被挖掘出来,"前端项目架构"终于超越了"框架",升华了。

如果你觉得你已经非常熟悉Web MVC框架,从Struts到Spring MVC、从Ruby on Rails到Backbone都有所涉猎,使用Angular应该会非常顺手,那么你就错了。Angular里面的很多概念,比如嵌入包含(transclusion)、指令(directive)、作用域隔离(isolate scope)等等,会让你倍受打击。

其实Angular的本意是简单可用,如果你准备好了花一些时间,好好研究下Angular中的概念,熟悉Angular的编码风格,等你超脱了,回过头来你会发现Angular相比很多框架而言,挺好用挺优雅。写到这,我脑海中清晰地蹦出一个词"习惯"。如果你和我一样,是一名不折不扣的Java开发工程师,刚入手JavaScript时,你或许也被它的编码风格折磨的半死,对于JS"回调函数"的编码方式一定嗤之以鼻,但习惯了,会发现JS"回调函数"是如此的好用优雅。

Angular:适合你吗?

ng2正式版本都快出来了,作为一个有高追求的前端开发工程师,你或许也应该学习学习Angular。我认为Angular中有不少概念是挺不错的,是对这些年前端开发优秀沉淀的一次总结,相信对于你会有不少的启发。就一个团队而言,Angular会带来"做得很少、拥有太多"的效果。

希望你看完这个系列之后,自己能发现Angular究竟适不适合你、适不适合你的团队。

关于系列标题

该系列的标题为浅入深出,或许你会疑问为什么不是深入浅出?Angualr和前端一样包罗万象,内功、外功都需要时间的沉淀,我只是希望大家能过通过这个系列的学习,能够深入思考Angular更多更有深度的问题。
目录
相关文章
|
设计模式 JavaScript 前端开发
学习Angular的编程之旅
学习Angular的编程之旅
|
监控 JavaScript
angular之入门基础
angular之入门基础
156 0
angular之入门基础
|
JavaScript 前端开发 容器
|
JavaScript
初露锋芒 Angular6 入门项目 - 2
初露锋芒 Angular6 入门项目 - 2
244 0
|
缓存 API 数据库
初露锋芒 Angular6 入门项目 - 4 上
初露锋芒 Angular6 入门项目 - 4 上
174 0
|
JavaScript 前端开发 测试技术
初露锋芒 Angular6 入门项目 - 3
初露锋芒 Angular6 入门项目 - 3
147 0
初露锋芒 Angular6 入门项目 - 4 下
初露锋芒 Angular6 入门项目 - 4 下
126 0
|
JavaScript 网络架构
初露锋芒 Angular6 入门项目 - 1
初露锋芒 Angular6 入门项目 - 1
226 0
|
前端开发 JavaScript
Angular4总结(一)—— 基础知识
Angular 程序架构 组件(Component) 是Angular的基本构建块,可以把它理解为包含业务逻辑和数据的交集。 组件的基本组成 装饰器 @Component 组件元数据装饰器 @Component({ selector: 'app-root', //被用作html标签调用 templateUrl: '.
1189 0
|
JavaScript API
angular6 render2 & viewContentRef实践
angular 渲染层   angular一个跨平台的框架不仅仅针对的浏览器这一个平台 ElementRef 与 TemplateRef   简单的理解:                ElemnetRef : 例如一个元素的引用;                TemplateRef: 例如template模板的引用; 再angular中,官方的说法是: 不推荐使用ElementRef来改变元素的样式属性值或者操作DOM元素,原因是,angular是一个跨平台的框架,如果直接使用ElementRef对DOM直接进行操作,那么在其他平台情况下会出事。
2264 0