Angular2开发者预览版出来已有一段时间,这个以速度与移动性能为目的的框架到底如何,今天我们来尝试一下。

在官网有一段号称5分钟入门的教程:

quick start: https://angular.io/docs/js/latest/quickstart.html

Angular团队在这个版本上所做的改变可以用激进来形容,我们可以看得到无论是在代码书写亦或是结构组织上都有了非常大的差异,那么,既然Angular1.x已经如此成熟了,那为何我们还需要Angular2这样大的改变呢?

其实无论是Angular2还是ReactNative,他们都肩负了前端许多的愿景,既然目前的前端环境调优已经基本达到巅峰,那么从原生、另一门语言的角度去审视改良只是我们突破与超越的小小尝试而已。

那么Angular2与1.x对比在写法与上手难度上到底有什么区别呢?

下面我将用Angular2来制作一个Todo示例应用:

在完成了初始化任务后,首先,确保我们的TypeScript编译监控处于启用状态,以下语句是作为ts文件修改编译监控:

 

整理一下我们的思路,文件结构应该是这样的:

QQ图片20150731233155

我们看到了熟悉的app.js文件,这是以app.ts编译过后的产物,app.ts:

在当前版本中,Template关键字已经被替换为View关键字,文档传送门:View

inde.html(墙内用户推荐将traceur-runtime.js/system.src.js/angular2.dev.js这几个文件保存在本地,这样可以不必忍受各种404,超时加载):

services/todo/todo.ts:

运行示例:

QQ图片20150731233925

 

原创文章转载请注明:

转载自AlloyTeam:http://www.alloyteam.com/2015/07/angular2-shi-yong-ti-yan/

  1. sacred 2016 年 6 月 17 日

    … 失望, 标题党

  2. 张米莱 2016 年 2 月 29 日

    这么大个标题 做了个demo

  3. 徐梓萱 2015 年 12 月 27 日

    经验啊… 向博主学习

  4. 雨夜 2015 年 9 月 25 日

    什么时候能出正试版呢,我准备学习Angular,是直接学习2呢,还是从1.X开始学呢!

    • anneleo 2015 年 12 月 24 日

      可以直接2

  5. C凉凉D 2015 年 9 月 1 日

    模板机制还处在拼接html标签的节奏?

  6. 雷鋒 2015 年 8 月 4 日

    Angular2還是Alpha階段吧,基本上是完全拋棄Angular1.0從新開發的版本…

    • TAT.simplehuang

      TAT.simplehuang 2015 年 8 月 10 日

      是的,现在Angular2还不是正式版的,官方也说了正式版有可能跟现在的大不一样,不管后面会怎样,现在也属于一种全新的开发方式探索

  7. 大米网 2015 年 8 月 3 日

    体验很重要

    • TAT.simplehuang

      TAT.simplehuang 2015 年 8 月 10 日

      嗯嗯,而且开发效率也很重要!

发表评论