Angular2——为克服Html在构建应用上的不足而设计!

?? ? AngularJS 诞生于2009年,由Misko Hevery 等人创建,后为Google所?#23637;骸?/span>201010月,Google 首次发布了自己的 Web 开发框架,名为 AngularJS,也叫 Angular,或者简称为 ng是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性,最为核心的是:MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。?2016918日,Angular2正式发布。?

?? ? Angular2是为了克服HTML在构建应用上的不足而设计的。HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了。所以我做了一些工作(你也可以觉得是小花招)来让浏览器做我想要的事。

?? ? 通常,我们是通过以下技术来解决静态网页技术在构建动态应用上的不足:

?? ? 类库类库是一些函数的集合,它能帮助你写WEB应用。起主导作用的是你的代码,由你来决定何时使用类库。类库有:jQuery

?? ? 框架框架是一种特殊的、已经实现了的WEB应用,你只需要对它填充具体的业务逻辑。这里框架是起主导作用的,由它来根据具体的应用逻辑来调用你的代码。框架有:knockoutsproutcore等。

?? ? Angular2使用了不同的方法,它尝试去补足HTML本身在构建应用方面的缺陷,它存在八大模块分别为模块 (module),组件 (component),模板 (template),元数据 (metadata),数据绑定 (data binding),指令 (directive),服务 (service),依赖注入 (dependency injection)

?? ? 如果要写一个Angular2Hello World应用相当简单,分三步走:

1. 引入Angular2预定义类型

import {Component,View,bootstrap} from “angular2/angular2”;

importES6的关键字,用来从模块中引入类型定义。在这里,我们从angular2模块库中引入了三个类型: Component类、View类和bootstrap函数。

2. 实现一个Angular2组件

实现一个Angular2组件也很简单,定义一个类,然后给这个类添加注解: 1. @Component({selector:”ez-app”})

  1. @View({template:”<h1>Hello,Angular2</h1>”})
  2. class EzApp{}

? ? class也是ES6的关键字,用来定义一个类。@Component@View都是给类EzApp附加的元信息, 被称为注解/Annotation@Component最重要的作用是通过selector属性(值为CSS选择符),指定这个组件渲染到哪个DOM对象上。[email protected]最重要的作用是通过template属性,指定渲染的模板。

3. 渲染组件到DOM

将组件渲染到DOM上,需要使用自举/bootstrap函数,通过这三部我们就轻而易举的将起组件实现。

? ? Angular2试图成为WEB应用中的一种端对端的解决方案。这意味着它不只是你的WEB应用中的一个小部分,而是一个完整的端对端的解决方案。这会让AngularJS在构建一个CRUD(增加Create、查询Retrieve、更新Update、删除Delete)的应用时显得很固执(原文为 opinionated,意指没有太多的其他方式)。但是,尽管它很固执,它仍然能确保它的固执只是在你构建应用的起点,并且你仍能灵活变动。AngularJS的一些出众之处如下:

? ??构建一个CRUD应用可能用到的全部内容包括:数据绑定、基本模板标识符、表单验证、路由、深度链接、组件重用、依赖注入。

? ??测试方面包括:单元测试、端对端测试、模拟和自动化测试框架。

? ? 具有目录布局和测试脚本的种子应用作为起点。

? ??但其实Angular2并不是万能的。通过为开发者呈现一个更高层次的抽象来简化应用的开发。如同其他的抽象技术一样,这?#19981;?#25439;失一部分灵活性。换句话说,并不是所有的应用都适合用AngularJS来做。AngularJS主要考虑的是构建CRUD应用。?#20197;?#30340;是,至少90%WEB应用都是CRUD应用。但是要了解什么适合用AngularJS构建,就得了解什么不适合用AngularJS构建。如游戏,图形界面编辑器,这种DOM操作很频繁也很复杂的应用,和CRUD应用就有很大的不同,它们不适合用AngularJS来构建。像这?#26234;?#20917;用一些更轻量、简单的技术如jQuery可能会更好。化繁为简,化简为零总是好的。二angular2能将你从一些噩梦中解脱出啦,如:使用回调,手动编写DOM元素的代码,对UI界面读写数据等等,不过最主要的还有一点,你在开?#35760;?#19981;用去写大量的基础性代码,让你很快的进入你应用的具体开发当中去,而且你还能能全盘掌握自动化测试的初始化过程。