Controls shown as required without validator (Reactive Form)
Posted: 28 Jul 2020, 04:50
I'm trying to create a simple reactive form but the UI is not working properly, the status change subscriber shows a valid form but the fields are showing errors
Please let me know if you need more details
Code: Select all
<div class="layout-dashboard">
<div class="p-grid ui-fluid">
<div class="p-col-12 p-lg-6">
<div class="card card-w-title">
<h1>Alta Usuario</h1>
<form class="p-grid" [formGroup]="altaForm" (ngSubmit)="onNuevoAlumno($event)">
<div class="p-col-12 p-lg-6">
<input pInputText placeholder="Primer Nombre" formControlName="primerNombre">
</div>
</form>
</div>
</div>
</div>
</div>
Code: Select all
import { Component, OnInit } from '@angular/core';
import { FormControl, Validators, FormGroup, FormBuilder } from '@angular/forms';
import { UserService } from '../service/user.service';
import { ROLES_OPTIONS } from 'src/constants/roles';
@Component({
templateUrl: './dashboard.component.html'
})
export class DashboardDemoComponent implements OnInit {
constructor(private userService: UserService, private formBuilder: FormBuilder) {
}
rol_options = ROLES_OPTIONS;
altaForm = this.formBuilder.group({
primerNombre: new FormControl('')
})
ngOnInit() {
this.altaForm.statusChanges.subscribe(result => {
console.log(result);
})
}
onNuevoAlumno(event){
console.log(this.altaForm.value)
}
}
Code: Select all
"dependencies": {
"@angular/animations": "~8.2.14",
"@angular/cdk": "^8.2.3",
"@angular/common": "~8.2.14",
"@angular/compiler": "~8.2.14",
"@angular/core": "~8.2.14",
"@angular/forms": "~8.2.14",
"@angular/platform-browser": "~8.2.14",
"@angular/platform-browser-dynamic": "~8.2.14",
"@angular/router": "~8.2.14",
"@fullcalendar/core": "4.0.2",
"@fullcalendar/daygrid": "4.0.1",
"@fullcalendar/interaction": "4.0.2",
"@fullcalendar/timegrid": "4.0.1",
"chart.js": "2.7.3",
"font-awesome": "4.7.0",
"intl": "1.2.5",
"primeflex": "^2.0.0-rc.1",
"primeicons": "1.0.0",
"primeng": "^9.1.3",
"prismjs": "1.15.0",
"quill": "1.1.8",
"rxjs": "6.4.0",
"tslib": "^1.10.0",
"web-animations-js": "github:angular/web-animations-js#release_pr208",
"zone.js": "~0.9.1"
}