hero-detail.component.ts

hero-detail.component.ts

...

@Component({
  selector: 'hero-detail',
  templateUrl: './hero-detail.component.html'
})

export class HeroDetailComponent implements OnChanges {

  heroForm: FormGroup;
  ...
  
  constructor(
    private fb: FormBuilder,
    this.createForm();
    ...
  }

  createForm() {
    this.heroForm = this.fb.group({
      name: new FormControl("", [
        Validators.required,
        Validators.minLength(4)
        ]),
      power: '',
      sidekick: ''
    });
  }
 
 ...
 
}