2 Way Data Binding in Angular 4

Two-way data binding combines the input and output binding into a single notation using the ngModel directive.

—-HTML file

<label>Name:</label>
<input [(ngModel)]="ninja.name">
<label>Belt:</label>
<input [(ngModel)]="ninja.belt">
<p>{{ninja.name}}</p>
<p>{{ninja.belt}}</p>

—-TS File (Component)

ninja = {
  name: 'Yoshi',
  belt: 'Black'
 };