AngularJS 2.0新特性有哪些


Posted in Javascript onFebruary 18, 2016

AngularJS已然成为Web应用开发世界里最受欢迎的开源JavaScript框架。自成立以来,见证其成功的是惊人的经济增长以及团体的支持与采用——包括个人开发者、企业、社区。

Angular已经变成一个构建复杂单页面应用的客户端MVW框架(Model-View-Whatever)。它在应用测试和应用编写方面都扮演重要角色,同时简化了开发过程。

Angular目前的版本为1.3,该版本稳定,并被谷歌(框架维护者)用于支持众多应用(据估计,在谷歌有超过1600个应用运行于Angular1.2或1.3)。Angular 2.0正式宣布与去年10月份的尼日利亚会议上,该版本不会是一个复杂的重大更新。

为什么推出Angular 2.0?

在进一步讨论Angular 2.0(估计发布日期为2015年底)之前,让我们简单的思考下新版本背后的哲学。Angular 2.0开发始于解决以下问题:

移动:新的版本将专注于移动应用的开发。依据是它更容易处理桌面方面的事情,一旦挑战涉及到移动(性能、加载时间),注重这方面会使问题得到解决。

模块化:各个模块将从Angular的核心中移除,从而获得更好的性能。这意味着你可以选择你需要的零件。
现代化:Angular 2.0将把ES6和“常青”现代浏览器(自动更新到最新版本)作为目标。这意味着开发者可以专注于业务领域相关的代码。

有哪些争议?

在尼日利亚会议上并没有提及迁移到2.0版本的途径。同时也指出跳转到2.0版本将会打破原有的1.3版本应用,不会有任何的向后兼容性。自从那时开始开发者社区一直充斥着不确定性和猜测,一些开发者也开始质疑是否值得开始一个新的Angular 1.3项目。

有哪些改变?

AtScript

AtScript是ES6的一个父集,被用于开发Angular 2.0。它是由Traceur编译器(连同ES6)处理来生成ES5代码并用TypeScript类型语法来生成执行时间的断言,以此来代替编译时的检查。不过AtScript并不是强制的,你仍然能够使用纯JavaScript/ES5代码代替AtScript来编写Angular应用。

改善依赖入驻(DI)

依赖注入(Dependency injection )模式的基本思想是客户类Client不用自己来初始化它所依赖的成员变量IServer,使用一个独立的对象创建IServer适当的实现类并将它赋值给Client的成员变量。它对模块开发与组件隔离特别有益。Angular 2.0将会解决Angular 1.X所存在的这个方面的问题。添加丢失的的特性,如child injectors和lifetime/scope控制。

Annotations

AtScript提供工具关联元数据和功能。这有助于构建提供必要信息到DI库的对象实例(检查相关元数据时调用一个函数或创建一个类的实例)。它还容易通过提供一个注解重载参数数据。

Child Injectors

一个child injector继承了其父类的所有性能服务。根据要求,不同类型的对象可以被调用,并且自动覆盖不同的范围。

实例范围

改进的DI库将以实例范围为特性,这在使用Child Injectors和自己的范围标识符时变得更加强大。

模板和数据绑定

在开发应用中,模板和数据绑定将齐头并进。

动态载入

这是当前Angular版本所缺失的一个特性,不过将在Angular 2.0中出现。这将让开发者可以在忙碌中添加新的指令或控制器。

模板

在Angular 2.0中,模板编译过程将是异步的。由于代码是基于ES6模块规格,该模块加载器将通过简单的引用组件定义来加载依赖关系。

指令

在Angular 2.0中将会出现三种指令:

组件指令——这些将通过JavaScript、HTML或一个可选的CSS样式表的封装逻辑创建可重复使用的组件。

装饰指令——这些指令将被用来装饰元素(例如添加一个工具提示,或使用ng-show/ng-hide来显示/隐藏元素)。

模板指令——这些将把HTML改变为可重复使用的模板。模板的实例化以及嵌入到DOM可以完全由指令控制。这样的例子包括ng-if和ng-repeat。

路由方案

初始的Angular路由是被设计用于处理一些简单的情况。然而,随着框架的发展,越来越多的功能被添加。在Angular 2.0中路由已经是可扩展的,它将包含以下基本功能:

简单的基于json路由配置;

优于配置的可选协定;

静态的。参数化的路由模式;

URL解析器;

支持查询字符串;

使用推送状态或Hashchange;

导航模型(生成一个导航UI);

文档标题更新;

404路由处理;

位置服务;

历史操作。

现在,让我们来看看那些让Angular 2.0达到新高度的路由特性:

子路由

子路由将把应用的每个组件通过为它们提供各自路由的方式转换成更小的应用,这将有助于封装整个应用的特性集。

屏幕激活

这将帮助开发者通过一组can*回调更出色的控制导航的生命周期:

canActivate——允许/阻止导航到新的控制器;

activate——响应成功到新的控制器的导航;

canDeactivate——允许/阻止导航远离旧的控制器;

deactivate——响应成功远离旧的控制器的导航;

这些回调将允许开发者返回Boolean值或一个命令(为了更低层次上的控制)。

设计

所有的这些逻辑都是使用流水线结构构建的,使得它非常容易将自己的步骤添加到流水线中或移除默认的东西。此外,它的异步特性将允许开发者使用服务器请求进行身份验证或为控制器加载数据,不过这还在规划中。

日志

Angular 2.0将包含一个被称为diary.js的日志服务——一个非常有用的特性,测量你在应用中时间花费在哪里。

Scope

$scope将从Angular 2.0中移除,取而代之的是ES6类。

结论

随着发布日期的临近,围绕Angular 2.0的兴奋和声音将会加剧。是否打破改变是一件好事?我们无法知道,不过反对者感到紧张是可以理解的,因为明显缺乏迁移的计划。Duang的一下就来了。不过其既然要来了,我们可以做的就是积极的迎接它。

以上内容给大家介绍了AngularJS 2.0新特性,希望对大家有所帮助!

Javascript 相关文章推荐
在一个js文件里远程调用jquery.js会在ie8下的一个奇怪问题
Nov 28 Javascript
文字不间断滚动(上下左右)实例代码
Apr 21 Javascript
JavaScript调用后台的三种方法实例
Oct 17 Javascript
Javascript基于AJAX回调函数传递参数实例分析
Dec 15 Javascript
JQuery解析XML数据的几个简单实例
May 18 Javascript
通俗解释JavaScript正则表达式快速记忆
Aug 23 Javascript
用vue构建多页面应用的示例代码
Sep 20 Javascript
vue中配置mint-ui报css错误问题的解决方法
Oct 11 Javascript
js使用xml数据载体实现城市省份二级联动效果
Nov 08 Javascript
详解js加减乘除精确计算
Mar 19 Javascript
微信小程序绑定手机号获取验证码功能
Oct 22 Javascript
vue和iview实现Scroll 数据无限滚动功能
Oct 31 Javascript
JavaScript+canvas实现七色板效果实例
Feb 18 #Javascript
javascript结合Flexbox简单实现滑动拼图游戏
Feb 18 #Javascript
Angular发布1.5正式版,专注于向Angular 2的过渡
Feb 18 #Javascript
iscroll.js的上拉下拉刷新时无法回弹的解决方法
Feb 18 #Javascript
javascript每日必学之条件分支
Feb 17 #Javascript
JavaScipt中栈的实现方法
Feb 17 #Javascript
Bootstrap入门书籍之(五)导航条、分页导航
Feb 17 #Javascript
You might like
Email+URL的判断和自动转换函数
2006/10/09 PHP
PHP调用MySQL存储过程并返回值的方法
2014/12/26 PHP
php字符串截取函数mb_substr用法实例分析
2019/06/25 PHP
ThinkPHP5与单元测试PHPUnit使用详解
2020/02/23 PHP
js每次Title显示不同的名言
2008/09/25 Javascript
第一个JavaScript入门基础 document.write输出
2010/02/22 Javascript
javascript闭包的理解和实例
2010/08/12 Javascript
JS中不为人知的五种声明Number的方式简要概述
2013/02/22 Javascript
BootStrap中Datetimepicker和uploadify插件应用实例小结
2016/05/26 Javascript
jquery模拟多级复选框效果的简单实例
2016/06/08 Javascript
js获取上传文件的绝对路径实现方法
2016/08/02 Javascript
Vue过滤器的用法和自定义过滤器使用
2017/02/08 Javascript
微信小程序 图片加载(本地,网路)实例详解
2017/03/10 Javascript
js解决软键盘遮挡输入框的问题分享
2017/12/19 Javascript
javascript动态创建对象的属性详解
2018/11/07 Javascript
微信小程序仿知乎实现评论留言功能
2018/11/28 Javascript
antd Form组件方法getFieldsValue获取自定义组件的值操作
2020/10/29 Javascript
关于better-scroll插件的无法滑动bug(2021通过插件解决)
2021/03/01 Javascript
python实现在sqlite动态创建表的方法
2015/05/08 Python
Python3读取zip文件信息的方法
2015/05/22 Python
在Python的Django框架中加载模版的方法
2015/07/16 Python
关于Python中异常(Exception)的汇总
2017/01/18 Python
scrapy爬虫:scrapy.FormRequest中formdata参数详解
2020/04/30 Python
Python爬虫实例——scrapy框架爬取拉勾网招聘信息
2020/07/14 Python
Roxy美国官网:澳大利亚冲浪、滑雪健身品牌
2016/07/30 全球购物
de Bijenkorf比利时官网:荷兰最知名的百货商店
2017/06/29 全球购物
党员学习十八大感想
2014/01/17 职场文书
军训教官感言
2014/03/02 职场文书
幼师求职自荐信
2014/05/31 职场文书
大学课外活动总结
2014/07/09 职场文书
思想纪律作风整顿剖析材料
2014/10/11 职场文书
万能检讨书
2015/01/27 职场文书
2015年基层党支部工作总结
2015/05/21 职场文书
婚宴父母致辞
2015/07/27 职场文书
贴吧吧主申请感言
2015/08/03 职场文书
使用Postman测试需要授权的接口问题
2022/06/21 Java/Android