import { Component, HostListener, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@Component({
selector: 'app-contact-form',
templateUrl: './contact-form.component.html',
styleUrls: ['./contact-form.component.css'],
})
export class ContactFormComponent implements OnInit {
myForm: FormGroup;
constructor(private fb: FormBuilder) {
this.myForm.valueChanges.subscribe(console.log);
}
ngOnInit() {}
createForm() {
this.myForm = this.fb.group({
name: ['', Validators.compose([Validators.required, Validators.minLength(3),
Validators.maxLength(50)
])],
email: ['', Validators.compose([Validators.required, Validators.email])],
gender: ['', Validators.required],
terms: ['', Validators.requiredTrue]
});
}
}
An Issue Detected!
Error: src/app/contact-form/contact-form.component.ts:15:5 - error TS2564: Property 'myForm' has no initializer and is not definitely assigned in the constructor.
15 myForm : FormGroup;
~~~~~~
src/app/contact-form/contact-form.component.ts:17:10 - error TS2565: Property 'myForm' is used before being assigned.
17 this.myForm.valueChanges.subscribe(console.log);