1. Importar los paquetes FormsModule, ReactiveFormsModule en app.module.ts
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
@NgModule({
declarations: [ ... ],
imports: [
FormsModule,
ReactiveFormsModule,
...
]
})
2. Crear etiqueta en el HTML:
<form [formGroup]="form">
3. Crear variable de formulario en el .ts
public form!: FormGroup;
4. Declaramos FormBuilder en el constructor.
private fb: FormBuilder
5. Crear formulario y declaramos en el constructor
constructor(
private fb: FormBuilder
) {
this.createForm();
}
createForm(){
this.form = this.fb.group({
anio: ['',[Validators.required]],
mes: ['',[Validators.required]]
});
}
6. Especificamos los valores de los formularios (anio, mes) a los componentes (input, select, etc.) del HTML con la propiedad formControlName.
<input type="text" id="idanio" name="nameanio" formControlName="anio" />