AngularJS 中的 1 路、2 路、3 路……或更多数据绑定？答案

【问题标题】：1-way, 2-way, 3-way, ... or more data binding in AngularJS?AngularJS 中的 1 路、2 路、3 路……或更多数据绑定？
【发布时间】：2015-02-10 13:12:48
【问题描述】：

粗略地说，1-way 数据绑定只是在页面内与ng-model 绑定，而当涉及控制器时，2-way 数据绑定。有人可以向我解释这个概念，以便我真正了解如何看待它吗？还有什么是3路数据绑定，还有4路、5路吗？

【问题讨论】：

【解决方案1】：

单向数据绑定 = 您的数据模型通常从控制器插入到您的视图/模板中，并且控制器中对模型的更改会更改视图中的数据。但反之则不然。

2 路数据绑定 = 同上，但您也可以在视图中更改数据模型。例如，如果您的控制器中有 $scope.title 并将其绑定到，则对 $scope 的任何更改。控制器中的标题会更改输入中的内容，对输入值的任何更改也会更改 $scope.title 变量以及 = 2-way 绑定。

【讨论】：

【解决方案2】：

（来自约翰安德鲁斯的回答）单向数据绑定 = 您的数据模型通常从控制器插入到您的视图/模板中，并且控制器中对模型的更改会更改视图中的数据。 2 路数据绑定 = 同上，但您也可以在视图中更改数据模型。

3-way = 您的数据与远程存储同步（例如 CouchDB） 4-way = 您的数据与本地数据库（如 localStorage 或类似）同步，并且该数据库与远程存储同步

【讨论】：

【解决方案3】：

单向数据绑定：非常简单。那是模型更新视图/模板。

双向数据绑定：此处模型填充视图，视图中的任何更改都会自动反映在模型中，反之亦然。例如

<input type="text" ng-model="name"/>
<h1>Hello {{name}}!</h1>

所以在这里，输入字段的值绑定到一个模型，即“名称”。每当“名称”发生变化时，它会立即在页面上更新。

想想图片，b'use不能发布它:(

模型 DOM

三路数据绑定：

Firebase 模型 DOM

在这里，类似 firebase 的数据库服务器只能更新模型而不是 DOM，即 UI。模型可以更新数据库服务器，即 firebase 和 DOM。所以模型拥有更新 UI 和数据库服务器的权力 :) 该模型可以填充 DOM，即 UI 反之亦然。

【讨论】：

【解决方案4】：

简短回答-

1 路 表示 HTML(ng-model/{{}}) 中的值被范围变量中的值替换。

2 路 变量和占位符/html(ng-model/{{}}) 值始终相互相等

3路涉及服务器的双向同步，当数据与服务器或数据库同步时。

// 这么多……

【讨论】：