This entry is mainly covered the Angular2 data binding, which are
One-way binding and
There are three ways to implement one way binding, which are
DOM property binding and
bind-DOM. Those three ways are technically equal. Just like below.
If the component property changed, the value of DOM will change automatically. BUT if the value of DOM changed, the component property will not changed corresponding. This is called
Class binding is aim to add additional class to DOM elements based on some condition,
Style binding is in the same process. Below is an example to add
active class to the button and background color to inline style.
Event binding is handle event rise from the DOM, like click, mouthmove, hover and etc.
Two-way binding is actually the combination of
property binding and
event binding. There are three ways to realise it.
If the input value changed, the Preview will changed at the same time (Means the compoment property value changed as well).
All related code could find in Github