Two-way binding

Last, but not least, is two-way binding, which is essentially a combination of event and property bindings. Not every property can be used with two-way binding, since it requires a certain convention and is used mostly in forms.

Two-way binding is used to bind an element's property to component data, in addition to updating the component data when the target element's property changes. You use two-way binding by surrounding a property with both parentheses and square brackets:

<input [(ngModel)]="myNameField" />

In the preceding example, ngModel is set with a two-way binding; thus, the input value is bound to the component's nameInput field and vice versa, so nameInput should change when the input value changes.

ngModel is ...

Get Hands-On Full-Stack Web Development with ASP.NET Core now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.