继上一篇的angular性能优化一文中说道:有些项目场景是只需要单次绑定,减少性能开销的。不久之前,AngularJS 1.3版本正式发布,其中添加了很多的性特性,同时也对之前的一些bug做了修复,最重要的是其中包含一些突破性的变化。其中最重要的一项就是添加了一次性数据绑定。 等等,一次性数据绑定?这听起来似乎和AngularJS一直宣扬的双向数据绑定思想完全背离了吗?当然,AngularJS的双向数据绑定一直是AngularJS最重要的特性之一。然而,为了实现双向数据绑定,AngularJS需要为每一个绑定的值都设置一个监听器(watcher)。当需要绑定的数据越来越多时,成堆的监听器会对应用的性能造成很坏的影响。在具体了解一次性数据绑定之前,先让我们来简单的回顾一下AngularJS中双向数据绑定究竟是怎么一回事。 理解双向数据绑定和监听器为了实现双向数据绑定,AngularJS使用了 每当你创建了一个数据绑定时,AngularJS就会自动创建一个监听器来监听这个数据的变化。比如说下面这个简单的例子:
在这个例子中,我们使用了插值指令,这个指令会注册一个监听器来监听相应作用域中属性 添加下面的代码,你的
通过上面的代码,我们就成功的使用了插值指令创建了在试图上创建了一个数据绑定。现在,如果
此时,点击按钮,我们可以将 上面的双向绑定魔法的实现完全依赖于 太多监听器存在的问题现在,我们大概了解了AngularJS的数据绑定机制,你可能会问我们为何还需要一次性数据绑定。 由于AngularJS使用监听器来实现数据绑定。当监听器越来越多时,可能会出现一些性能上的问题。由于在注册监听器使,同时会注册一个回调函数,以便在 现在假设在视图中有很多值需要被AngularJS处理。比如说像上面使用插值指令来进行数据绑定,虽然我们可能并不想让这个值只绑定一次,比如说上面的 一次性数据绑定(One-time bindings)这就是我们需要一次性数据绑定的原因。在AngularJS的文档中,我们可以清楚的了解到这个新特性的作用:
一次性数据绑定的出现解决了前面提到的由监听器太多带来的性能问题。那么我们应该如何使用一次性数据绑定呢? 使用一次性数据绑定非常的简单,我们只需要在表达式之前加上双冒号
使用一次性数据绑定,我们这样写:
在AngularJS 1.3版本中,你可以在任何AngularJS的表达式中使用一次性数据绑定。即使在诸如
总结一次性数据绑定的出现解决了AngularJS中饱受诟病的性能问题,官方版本原生支持也使我们不需要在使用 本文参考自EXPLORING ANGULAR 1.3 - ONE-TIME BINDINGS,原文地址http://blog./angularjs/2014/10/14/exploring-angular-1.3-one-time-bindings.html 相关阅读angular性能优化 |
|
来自: 菩提与蜗牛 > 《AngularJS》