Form directives

Abstractly describing input is all well and good, but at some point we will need to connect it to the UI.

@angular/forms provides two modules that do that: FormsModule and ReactiveFormsModule.

ReactiveFormsModule

ReactiveFormsModule is simpler to understand and explain than FormsModule. That's why I will cover it first.

@Component({
selector: 'filters-cmp',
template: `
    <div [formGroup]="filters">
      <input formControlName="title" placeholder="Title">
      <input formControlName="speaker" placeholder="Speaker">
      <input type="checkbox" formControlName="highRating">
      High Rating
    </div>
  `
})
export class FiltersCmp {
  filters...