Two-way Binding

Angular supports two-way data binding, meaning that changes in the DOM, such as user choices, are also reflected in your program data. This feature allows us to both read and write to a property at the same time.

<label>The awesome input</label>
<input [(ngModel)]="dynamicValue" placeholder="Watch the text update!" 
type="text">
<label>The awesome output</label>
<span>{{dynamicValue}}</span>

Although, by default ngModel isn't imported. We have to add the FormsModule from @angular/forms into the imports array in the app-module.ts.