Angular has removed a core feature from its framework, which was one main reason for the birth of AngularJS, that is, two-way binding. So, two way binding is not available by default. Now, let's see how to implement a two-way binding in Angular.

Angular combined property and event binding for us to implement two-way binding, as shown in the following line of code:

<input [(ngModel)]="authorName">

The code snippet shows that ngModel is wrapped with parentheses and then with square brackets. The parentheses indicate that the component property is tied up with the ngChange event, and the square brackets indicate that the component property is assigned to a value property of the input element. So, when the value of the input element changes, it fires up the change event that eventually updates authorName with the new value from the event object. ngModel in the markup is the built-in directive in Angular that unifies property and event binding.

Template markup that helps data flow in both ways, from a template to a component and from a component to a template, is given in the following table (two-way binding):