加载中

The upcoming AngularJS 1.3 release arrives with a heavy focus on improved form data manipulation. While this version solves some real-life pain points, for some developers, it may not be an automatic upgrade.

The AngularJS team has starting rolling out Release Candidates of version 1.3. On a Google+ post the Angular team wrote:

most of the API for 1.3 is decided upon and the next releases up until 1.3.0 stable will be fixing the remaining bugs.

Among the new features for version 1.3 are:

  • new validators pipeline

  • asynchronous custom validators

  • model data binding options

  • ngMessages module for error message reuse

  • one-time data binding support

即将到来的 AngularJS 1.3 版本会放出对提升表单数据操作的重点关注. 而这次的版本解决了一些真正的痛点,对于一些开发者而言,这次的版本可能不是一次自动升级(言下之意就是需要开发者自己做一些额外的事情).

 AngularJS 团队推出1.3版的候选版本。在一份 Google+ 贴子 上 Angular 团队写到:

1.3版的大多数API已经做出了裁定,而接下来版本一直到1.3.0稳定版将会修复遗留的bug.

 1.3 的一些特性如下:

  • 新的验证器管道

  • 异步的自定义验证器

  • 模型数据绑定选项

  • 用于错误消息重用的 ngMessages 模块

  • 对一次性数据绑定的支持

The latest version provides developers with a new way to create custom validators, removing the need to use parsers and formatters. To create a custom validator in 1.3 the developer must register it on the new $validators pipeline and return true or false:

ngModule.directive('validateLessthanfive', function() {

  return {
    require : 'ngModel',
    link : function($scope, element, attrs, ngModel) {
      ngModel.$validators.lessthanFive = function(value) {
        return (value < 5);
      }; 
    }
  }
});

Matias Niemela, an Angular contributor, wrote a thorough write up on the new forms features including the new ability to create asynchronous validators for providing server based validation. Matias also noted the improved parity with HTML5 validators:

Now all of the HTML5 validation attributes are properly bound to ngModel and the errors are registered on ngModel.$error whenever the validation fails.

最新版为开发者提供了创建自定义验证器的新方法, 去除了对使用转换和格式化装置的需求. 为了在1.3中创建一个自定义的验证器,开发者必须在新的$validators管道上注册这个验证器并返回true或者false:

ngModule.directive('validateLessthanfive', function() {

  return {
    require : 'ngModel',
    link : function($scope, element, attrs, ngModel) {
      ngModel.$validators.lessthanFive = function(value) {
        return (value < 5);
      }; 
    }
  }
});

Matias Niemela是一名Angular贡献者,他写了一篇文章 概述了新的表单特性 包括为提供基于服务器的验证创建异步验证器的新功能. Matias 同时也指出了对HTML5验证器的提升:

现在所有的 HTML5 验证属性都被绑定到ngModel,它们的错误消息都注册到了 ngModel.$error

The Angular team introduced breaking changes in version 1.3, which some developers have complained should come with a major version update (e.g. version 2.0). In a recent GitHub commit Chad Moran, Software Development Manager for Woot, warns:

Making a breaking change and not bumping the major version is most likely going to create a lot of pain for users.

One change with the potential to impact enterprise developers is that 1.3 no longer supports IE8. Developers had plenty of warning since the Angular team announced this on their blog in December of 2013. Part of the reasoning behind this change is that 1.3 only supports jQuery 2.1 or above and jQuery dropped IE8 support for version 2.x.

Angular 团队在版本1.3中引入了重大的修改,一些开发者抱怨这次重大修改应该要带来一次主版本的更新(比如. 版本 2.0). 在最近的一次 GitHub 评论上 Chad Moran(Woot的软件开发经理)警告道:

做出重点修改却不提升主版本号,很有可能给用户带来很多的痛苦.

潜在的会影响到企业开发者的变化就是1.3版不再支持IE8. 自从 Angular 团队在它们 2013年12月的博客上 公布了这个事情,开发者已经发出了大量的警告. 这个修改的背后的部分原因是 1.3 只支持 jQuery 2.1 或者以上版本,而jQuery在版本2.x去掉了对IE8的支持.

In earlier versions of Angular, showing form validation error message was an exercise in combining ng-if directives and plenty boolean logic to display the right error message at the right time. Version 1.3 introduces the ngMessages module as an improved way to deal with complex validation error messages. An example of this new syntax from the yearofmoo.com blog post:

<form name="myForm">
  <input type="text" name="colorCode" ng-model="data.colorCode" minlength="6" required />
  <div ng-messages="myForm.colorCode.$error" ng-if="myForm.$submitted || myForm.colorCode.$touched">
        <div ng-message="required">...</div>
        <div ng-message="minlength">...</div>
        <div ng-message="pattern">...</div>
  </div>
</form>

According to Niemela, beyond reducing the lines of code, the new ng-messages module will "solve the complexity of one error showing up before the other."

在Angular的早期版本中,显示表单验证错误消息就是结合 ng-if 指令和许多布尔逻辑来在对的时间展示恰当的错误消息,这样的操作. 版本1.3引入了 ngMessages 模块,作为一种处理复杂验证错误消息的升级方式. 下面是来自 yearofmoo.com 博客文章 的有关这个新语法的示例:

<form name="myForm">
  <input type="text" name="colorCode" ng-model="data.colorCode" minlength="6" required />
  <div ng-messages="myForm.colorCode.$error" ng-if="myForm.$submitted || myForm.colorCode.$touched">
        <div ng-message="required">...</div>
        <div ng-message="minlength">...</div>
        <div ng-message="pattern">...</div>
  </div>
</form>

据Niemela所述, 不仅在于减少了代码的行数,新的ng-message模块将”解决一条错误消息在另外一条错误消息之前显示的复杂性"。

It's not clear when 1.3.0 will reach a stable release, but for version 1.2, there were three release candidates spread over three months. So far there have been three release candidates for 1.3 in three weeks. Beyond version 1.3 is version 2.0 which, according to a blog post by the Angular team, will focus on making Angular a "framework for mobile apps".

AngularJS is a JavaScript framework created by Google.

目前还不清楚1.3.0何时会达成一个稳定版本,而对版本1.2而言,有三个候选版本扩散了超过三个月的时间. 目前已经有三个针对1.3的候选版本扩散了三个星期. 版本 1.3 之上就是 2.0, 根据Angular团队的一片帖子,这一版本将会专注于让Angular成为一个"用于移动应用的框架".

AngularJS 是由谷歌赞助的一个JavaScript框架。

返回顶部
顶部