0
394
ViewsAngular/IONIC Formgroup no se aplica a las entradas de plantilla
Creé un proyecto Ionic con Angular e hice un pequeño formulario de inicio de sesión con correo electrónico y contraseña. Por lo tanto, estoy usando FormGroup y Formbuilder de Angular como lo describen los documentos oficiales de Ionic: https://ionicframework.com/docs/v3/developer-resources/forms/
Le estoy dando a la entrada de correo electrónico un valor predeterminado para ver si está funcionando y también el botón de inicio de sesión está deshabilitado siempre que el formulario no sea válido (ambos campos requeridos por los validadores). Pero las entradas no coinciden con el estado de mi formulario, el estado siempre permanece igual que cuando se inicializó y el formulario nunca se vuelve válido.
Salida del valor formGroup en la consola (creado después de escribir en los campos de entrada, por supuesto): 
Espero que alguien aquí tenga una idea de lo que podría ser. Gracias.
Mi código:
export class LoginComponent { private loginForm: FormGroup; constructor( private authService: AuthService, private formBuilder: FormBuilder ) { this.loginForm = this.formBuilder.group({ mail: ['buildermail@form.com', Validators.required], pass: ['', Validators.required], }); } login() { console.log(this.loginForm.value); // Output: 'buildermail@form.com', null -> doesn't matter what's in the actual inputs } } <ion-card-content class="content__card-content"> <form [formGroup]="loginForm" (ngSubmit)="login()"> <ion-item class="content__card-content__username"> <ion-label position="floating">E-Mail</ion-label> <ion-input formControlName="mail" type="email" [required]="true" ></ion-input> </ion-item> <ion-item class="content__card-content__password"> <ion-label position="floating">Password</ion-label> <ion-input formControlName="pass" type="password" [required]="true" ></ion-input> </ion-item> <ion-button type="submit" [disabled]="!loginForm.valid">Login</ion-button> </form> </ion-card-content>2 answers
Answer question0
Cambie formControlName="contraseña" a formControlName="pass" "contraseña" en el archivo html
También "formulario de inicio de sesión" de privado a public
0
Solucionado: No se ha aplicado el formgroup ya que no se ha facilitado correctamente. Necesitaba importar 'ReactiveFormsModule' y 'FormsModule' en el módulo donde se declara el componente. También tuve que importar este módulo en mi app.module.ts: Ionic no mostró un error aquí por compilación, al compilar con angular, arrojó un error que no se proporcionó correctamente.