<form [formGroup]="dataForm" (ngSubmit)="onSubmit()">
<div class="form-field form-field-name">
<label>Full Name</label>
<input [class]="dataForm.get('name').touched && dataForm.get('name').invalid ? 'invalid':''"
formControlName="name" type="text" placeholder="Full Name" />
<div class="sub-btn">
<button type="submit">Next</button>
</div>
</div>
</form>
export class DashboardActivityPage implements OnInit {
dataForm: FormGroup;
constructor(
private fb: FormBuilder,
) { }
ngOnInit() {
this.onInitForm();
}
onInitForm() {
this.dataForm = this.fb.group({
name: [null, Validators.required],
})
}
onSubmit() {}
}
.invalid {
border: 1px solid red !important;
background-color: rgb(255 0 0 / 9%) !important;
}
@NgModule({
imports: [
FormsModule,
ReactiveFormsModule,
],
Top comments (0)