ng-bind与角度中的一次绑定有什么区别

Question

＆＃34; ng-bind＆＃34;有什么区别？和＃34;一次约束＆＃34;在角js。

如果有任何差异，我应该在哪里使用它们？

Answer 1

双向数据绑定

AngularJS中的双向数据绑定意味着将数据从Model绑定到View，反之亦然（数据从Scope / Controller流向View，从View流到范围/控制器）。 ＆＃39;的 NG-模型＆＃39;是一个用于实现双向数据绑定的角度指令。无论视图是否要求更新数据，从范围/控制器对该模型的任何修改都将自动传播到视图，并且从视图对该模型的任何修改将立即反映回范围/控制器。

单向数据绑定

AngularJS中的单向数据绑定意味着将数据从Model绑定到View（数据流从范围/控制器流向视图）。 ＆＃39;的纳克绑定＆＃39;是一个用于实现单向数据绑定的角度指令。绑定后，无论视图是否要求更新数据，对范围/控制器对该模型的任何修改都将自动传播到视图。对于从视图到控制器的模型的任何更改，都不会发生传播。

一次性数据绑定

顾名思义，绑定只发生 ，即在第一个摘要周期中。一次性绑定允许模型或视图在第一个摘要循环时从控制器设置的值更新。从AngularJS 1.3开始，您可以使用＆＃34; :: ＆＃34;令牌创建一次性数据绑定。这些绑定在值稳定后取消注册自己的$ watch（）函数（这基本上意味着定义了值）。

一次性绑定用于页面稳定后不会发生变化的值。 ＆＃34;稳定＆＃34;通常表示已为表达式赋值。设置值后，控制器中值的更改不会更改显示的值，直到重新加载页面。 语法是{{:: expression}}。

因此，对于那些在页面稳定后不会发生变化的值或列表，请始终尝试使用一次性绑定。这将减少我们的应用程序中不必要的观察者的数量。

＆＃13;

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js"></script>

<div ng-app="myApp" ng-controller="myCtrl">
    <div ng-repeat="customer in ::customers" >
    {{::customer.name}}
    ({{customer.address}})
      <button ng-click="change(customer)">Change</button>
     </div>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.customers = [{
        name: 'Gloria Jane',
        address: 'Silo Park, 9300 East Orchard Road,    Greenwood Village, CO, 80114'},{
        name: 'Nicholas Michael',
        address: 'Village Park,  East Lake Avenue, Aurora, CO, 80016'
    }];
  
    $scope.change = function(customer) {
        customer.address = 'Cherry Creek State Park, 4201 S Parker Rd, Aurora, CO 80014, USA';
        customer.name ='Tessy Thomas';
    };
});
</script>

＆＃13;

＆＃13;

＆＃13;

Answer 2

这些不是相互排斥的概念。您也可以使用ng-bind进行一次性绑定：

＆lt; div ng-bind =＆＃34; :: productName＆＃34;＆gt;＆lt; / div＆gt;

Answer 3

“ng-bind”只是AngularJS常规{{表达式}}语法的html属性版本。

因此，<div ng-bind="productName"></div>相当于<div>{{productName}}</div>。

一次性绑定用于在页面稳定后不会更改的值。 “稳定”通常表示已为表达式赋值。设置值后，在重新加载页面之前，对控制器中值的更改不会更改显示的值。

语法为{{::expression}}。按照上面的示例，语法是

<div>{{::productName}}</div>

可以在此处找到用于确定页面是否稳定的算法的完整说明：

https://docs.angularjs.org/guide/expression

Answer 4

双向数据绑定

双向数据绑定提供了轻松获取示波器上属性值并在视图上显示的能力，同时还有一个文本输入更新它而没有任何疯狂的逻辑

一次性数据绑定

首先，我想确定指出这不是单向数据绑定。这样的事情并不像Angular提供的惯例那样存在。一次性绑定允许模型或视图在第一个摘要周期内从控制器设置的值更新为ONCE。

Answer 5

我很容易理解，

双向数据绑定- ng-model

同时链接变量的{{}}（在HTML中）和$scope（在控制器中），并在发生任何更改时更新变量的值。

单向数据绑定- ng-bind

仅从$scope到{{}}的链接，反之亦然。