AngularJS offers two-way databinding.
AngularJS提供双向数据绑定。
I built several AngularJS apps and found two-way databinding to be a powerful feature, that increased my productivity.
我构建了几个AngularJS应用程序，发现双向数据绑定是一个强大的功能，可以提高我的工作效率。
Recently however I come more and more across posts and articles that claim that two-way databinding is an antipattern.
然而，最近我越来越多的帖子和文章声称双向数据绑定是反模式。
Examples:
例子：
- https://medium.com/este-js-framework/whats-wrong-with-angular-js-97b0a787f903#.py84tbylf
- https://medium.com/este-js-framework/whats-wrong-with-angular-js-97b0a787f903#.py84tbylf
- https://www.dotnetrocks.com/?show=1147
- https://www.dotnetrocks.com/?show=1147
- https://www.youtube.com/watch?v=DslsyqnyjQE
- https://www.youtube.com/watch?v=DslsyqnyjQE
- Angular2 two-way data binding
- Angular2双向数据绑定
Most of the resources argue in favour of "Unidirectional Dataflow" like it is promoted by React/Flux.
大多数资源支持“单向数据流”，就像React / Flux推动的那样。
Also Angular2 announced for some time that there will be no two-way binding... but the latest documentation shows that it is actually offering two-way databinding via ngModel again (implemented on top of property- and event-binding)
Angular2也宣布一段时间没有双向绑定......但是最新文档显示它实际上再次通过ngModel提供双向数据绑定（在属性和事件绑定之上实现）
However I do not yet fully understand the problems that relate to two-way databinding in AngularJS.
但是，我还没有完全理解与AngularJS中的双向数据绑定相关的问题。
Other client technologies (i.e. swing, eclipse-rcp, winforms, wpf ...) also offer two-way databinding, and I never stumbled over the claim that it is an anti-pattern ...
其他客户端技术（即swing，eclipse-rcp，winforms，wpf ......）也提供双向数据绑定，我从来没有偶然发现它是一个反模式...
Is there a canonical example that easily illustrates the problems that might result from two-way databinding in AngularJS?
是否有一个规范的例子可以很容易地说明AngularJS中双向数据绑定可能导致的问题？
The video I linked above seems to hint that $scope.watch is the problem ... but the example can be implemented without $scope.watch by binding to a function exposed on the $scope.
If you avoid using $scope (i.e. using controller as), what problems remain with two-way databinding?
我上面链接的视频似乎提示$ scope.watch是问题...但是这个例子可以通过绑定到$ scope上公开的函数来实现，而无需$ scope.watch。如果你避免使用$ scope（即使用控制器），那么双向数据绑定会出现什么问题？
1 个解决方案
#1
5
In fact, the main problem with two-way data binding is performance.
实际上，双向数据绑定的主要问题是性能。
When AngularJS was released (1), this feature was the foremost reason why the framework was much used by developers.
当AngularJS发布时（1），此功能是开发人员大量使用该框架的首要原因。
Without a line of code, you can make an element fully dynamic by changing its value from the model side or the view side, the value is changed everywhere the model is set.
如果没有一行代码，您可以通过从模型侧或视图侧更改其值来使元素完全动态化，在模型设置的任何位置都会更改值。
In this feature, the most important tool is the watching, and it represents all the problem with two-way data binding.
在此功能中，最重要的工具是观看，它代表了双向数据绑定的所有问题。
As the application evolves, the number of watchers and watched elements increases.
Also, after a time, the application can become a big soup of watchers.
This will result in your application always watching elements and keeping up-to-date the elements at the inverse side, and that consumes a lot of resources from the browser.
随着应用程序的发展，观察者和观察元素的数量也在增加。此外，一段时间后，应用程序可以成为观察者的大汤。这将导致您的应用程序始终关注元素并在反面保持最新元素，并从浏览器中消耗大量资源。
This is why my recommendation is: Avoid watchers as much as possible.
They are almost never really necessary in a controller.
这就是为什么我的建议是：尽可能避免观察者。在控制器中几乎不需要它们。
See also :
也可以看看 ：
- Effective strategies to avoid watches in AngularJS
- 在AngularJS中避免使用手表的有效策略
- The bad parts of AngularJS
- AngularJS的不良部分
- Performances in large AngularJS applications
- 大型AngularJS应用程序中的性能
Hope it's more clear for you.
希望对你来说更清楚。
#1
5
In fact, the main problem with two-way data binding is performance.
实际上，双向数据绑定的主要问题是性能。
When AngularJS was released (1), this feature was the foremost reason why the framework was much used by developers.
当AngularJS发布时（1），此功能是开发人员大量使用该框架的首要原因。
Without a line of code, you can make an element fully dynamic by changing its value from the model side or the view side, the value is changed everywhere the model is set.
如果没有一行代码，您可以通过从模型侧或视图侧更改其值来使元素完全动态化，在模型设置的任何位置都会更改值。
In this feature, the most important tool is the watching, and it represents all the problem with two-way data binding.
在此功能中，最重要的工具是观看，它代表了双向数据绑定的所有问题。
As the application evolves, the number of watchers and watched elements increases.
Also, after a time, the application can become a big soup of watchers.
This will result in your application always watching elements and keeping up-to-date the elements at the inverse side, and that consumes a lot of resources from the browser.
随着应用程序的发展，观察者和观察元素的数量也在增加。此外，一段时间后，应用程序可以成为观察者的大汤。这将导致您的应用程序始终关注元素并在反面保持最新元素，并从浏览器中消耗大量资源。
This is why my recommendation is: Avoid watchers as much as possible.
They are almost never really necessary in a controller.
这就是为什么我的建议是：尽可能避免观察者。在控制器中几乎不需要它们。
See also :
也可以看看 ：
- Effective strategies to avoid watches in AngularJS
- 在AngularJS中避免使用手表的有效策略
- The bad parts of AngularJS
- AngularJS的不良部分
- Performances in large AngularJS applications
- 大型AngularJS应用程序中的性能
Hope it's more clear for you.
希望对你来说更清楚。