angularjs中单向绑定和双向绑定之间的区别

Question

你能解释一下之间的区别One-way Data Binding,并Two-way Data Binding用一个例子和情况,我们使用？

Answer 1

单向数据绑定

ng-bind有单向数据绑定(Model($scope) --> View) 例如. ng-bind="myText"要么{{ myText }}

它显示$scope.myText插入HTML 的范围值,其中myText是范围变量名称.(例如,模型 - >视图)

双向数据绑定

ng-model 旨在主要放在表单元素内,并具有双向数据绑定

(Model($scope) --> View and View --> Model($scope))

例如. <input name="firstname" ng-model="firstname"/>

当您与要与之交互的表单元素firstname进行ng-model交互$scope.firstname并按Digest周期自动更新相应的视图时(例如,模型 - >查看和查看 - >模型)

一次性数据绑定

新语法::在任何值(单向或双向)前面添加,声明我们想要one time binding:

<p>
  {{ ::firstname }}
</p>

一旦firstname定义并包含一个值,AngularJS就unbind可以了,任何模型更新都不会影响View.

例如.使用ng-if时

<div ng-if="::user.firstname"></div>

使用ng-class时

<div ng-class="::{ 'active': user.firstname }"></div>

使用重复时

<ul>
  <li ng-repeat="user in ::users"></li>
</ul>

Answer 2

单向绑定是将数据从模型绑定到视图.另外,双向绑定是将数据从模型绑定到视图并查看到模型.

Answer 3

UI 中的数据绑定是将 UI 字段绑定到数据模型。数据绑定有两种方法：一种方式数据绑定和两种方式数据绑定

数据绑定 -> 模型的一种方式是单一的事实来源。UI 上发生的任何事情都会触发一条消息以进行建模以更新部分数据。所以数据是单向流动的，这很容易理解。

双向数据绑定 -> UI 字段中的任何更改都会更新模型，模型中的任何更改都会更新 UI 字段。

由于数据的单向流动，数据绑定的一种方式是更好的方法。也只有模型有权更改应用程序状态。