How does the two-way binding with observables work under the hood?

[gustavs....@gmail.com]

Hi,

I am doing a research on data binding in JavaScript frameworks. I am trying to understand how the two way binding works when using observables.

So we know that with observables when the viemodel gets updated it will be reflected in the UI and when an input field's value changes it will be reflected in the viewmodel. How does the mechanism work under the hood?

My current understanding is that it is done via pusblish/subscribe pattern. Observable subscribes to changes in the input field and the input field value subscribes to changes in the observable. Am I understanding it correctly or am I completely wrong?

Thank you!

[Gunnar Liljas]

How it really works is actually up to the "Binding Handler", of which there are many built in, but you can also make your own. It's not quite publish/subscribe though...

If your look at the "value" handler...

https://github.com/knockout/knockout/blob/master/src/binding/defaultBindings/value.js

it's quite complex, since it has to deal with browser anomalies etc., but in general it just comes down to two methods in a handler.

"init"

Set up the event handlers you need (the soon-to-be bound element is given as the first argument), and what should happen when they fire.

"update"

Define what should happen if an observable, bound via the binding handler, is modified. Usually it should do something with the element, such as setting its field value.

The documentation on custom bindings may be what you need.

http://knockoutjs.com/documentation/custom-bindings.html

/G 

 

--
You received this message because you are subscribed to the Google Groups "KnockoutJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to knockoutjs+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.