Two-way data binding (Angular) vs one-way data flow (React/Flux)

Question

In the last week, I’ve been trying to make sense how two-way data binding (Angular) and one-way data flow (React/Flux) are different. They say that one-way data flow is

Answer 1

Let's say your app is just a wizard flow, but it has some complex interactions i.e. one step might change a following step behavior.

Your app is running great, but one day an user reports a bug on one of the tricky steps.

How does debugging would work on two-way binding and one-way binding?

Two-way binding

I'd start checking what behavior is different and with some luck, get to the same point as the user and pinpoint the bug. But at the same time there might be some weird interaction between different parts of the app. I might have some data-binding that is incorrect (e.g. replicating the model state but not binding) or other weird intricacy between components that is hard to debug. It might be hard to isolate the bug.

One-way binding

You just grab the state object. It has all the information of the app currently in a big javascript object. You load the same state in your development environment, there is a big chance your app will behave exactly the same. You can even write a test with the given state for regression and pinpoint the exact problem that is happening.

Conclusion

In a few words, one-way binding makes it very easy to debug complex apps. You don't have to do much then copy over the current state of the user.

Even that doesn't work, you can log the actions as well. There isn't AFAIR an easy way to track all the state modifying actions on Angular, for instance. With Redux it's pretty, pretty easy.