为了实现双向数据绑定,AngularJS使用了<代码>美元看> 美元rootScope>
在这个例子中,我们使用了插值指令,这个指令会注册一个监听器来监听相应作用域中属性名称的变化,并在该属性发生变化时将它实时反应到DOM中。 添加下面的代码,你的名字属性将会自动的被赋值为帕斯卡: ,通过上面的代码,我们就成功的使用了插值指令创建了在试图上创建了一个数据绑定。现在,如果名称属性发生变化,视图将会自动发生更新。比如说我们添加下面的代码,在按钮点击是修改名称的值: ,此时,点击按钮,我们可以将名称的值修改为Christoph,同时我们会触发一个美元消化循环来更新DOM中相应的部分。在上面的例子中,你看的知识单向数据绑定。然而,你完全可以使用ngModel指令来将视图中发生的变化实时的反应到模型中。 上面的双向绑定魔法的实现完全依赖于消化美元<代码> 循环,当美元消化循环被触发时,AngularJS将会去处理遍历当前作用域和子作用域中的所有监听器,然后通过检查模型中发生的变化来更新DOM中的值,直到模型不再发生变化为止。一美元旦消化循环执行完成,浏览器会重新渲染DOM来反应模型数据变化。 ,现在,我们大概了解了AngularJS的数据绑定机制,你可能会问我们为何还需要一次性数据绑定。 由于AngularJS使用监听器来实现数据绑定。当监听器越来越多时,可能会出现一些性能上的问题。由于在注册监听器使,同时会注册一个回调函数,以便在美元消化循环执行时能够相应的更新视图。也就是说,监听器越多,AngularJS需要处理的回调函数也就越多。 现在假设在视图中有很多值需要被AngularJS处理,比如说像上面使用插值指令来进行数据绑定,虽然我们可能并不想让这个值只绑定一次,比如说上面的帕斯卡,在应用代码执行的整个过程中这个属性都不会发生改变,但是AngularJS默认依然会在这个属性上绑定一个监听器和回调函数,因此,在<代码>消化时,美元AngularJS依然会去特意的关注这个值,这实在是有些过头了。 这就是我们需要一次性数据绑定的原因。在AngularJS的文档中,我们可以清楚的了解到这个新特性的作用:一次性数据绑定表达式可以在数据稳定之后,不需要在消化美元<代码> 循环中重计算… 一次性数据绑定的出现解决了前面提到的由监听器太多带来的性能问题。那么我们应该如何使用一次性数据绑定呢? 使用一次性数据绑定非常的简单,我们只需要在表达式之前加上双冒号::即可。比如,前面我们使用了插值指令将名字属性绑定到了视图中: 使用一次性数据绑定,我们这样写: 在AngularJS 1.3版本中,你可以在任何AngularJS的表达式中使用一次性数据绑定。即使在诸如ng-repeat这样严重依赖于双向绑定的指令中,你依然可以使用它。 以上所述是小编给大家介绍的AngularJS中的一次性数据绑定(bindonce),希望对大家有所帮助,如果大家有任何疑问请给我留的言,小编会及时回复大家的。在此也非常感谢大家对网站的支持! 深入浅析AngularJS中的一次性数据绑定(bindonce)
