Tengo en mi aplicación de un formulario de registro. Pero dentro de este formulario de inscripción no es una opción «contraseña» y «repetir contraseña» de entrada. Pues yo prefiero no usar el FormControl objeto de recuperar estos 2 valores otros valores están bien), me gustaría una solución para el uso de ngModel dentro de un <form>


MCVE

TS:

public password: string = '';
public passwordRe: string = '';
public registrationForm;

constructor(public fb: Formbuilder) {
    this.registrationForm = this.fb.group({
       'firstname' : [null, Validators.required],
       'lastname': [null, Validators.required]
    });
 }

HTML

<form [formGroup]="registrationForm" (ngSubmit)="doSomething()">
            <div class="form-group"
            [ngClass]="{'has-error':!registrationForm.controls['firstname'].valid 
            && registrationForm.controls['firstname'].touched}">
                <label>Firstname: *</label>
                <input class="form-control" type="text" placeholder="Firstname" [formControl]="registrationForm.controls['firstname']"/>
            </div>

            <div class="form-group"
            [ngClass]="{'has-error':!registrationForm.controls['lastname'].valid 
            && registrationForm.controls['lastname'].touched}">
                <label>Lastname: *</label>
                <input class="form-control" type="text" placeholder="Lastname" [formControl]="registrationForm.controls['lastname']"/>
            </div>

            <!-- NG MODELS -->

            <input type="password" [(ngModel)] = "password"/>
            <input type="password" [(ngModel)] = "passwordRe" />

            <input type="submit" value="Some submit button"/>
</form>

Esta página se muestra en varias páginas como un niño, a través de selector. La colocación de las contraseñas en la parte superior, fuera de la forma, sería el más perezoso de la solución, pero yo tendría que cambiar algo de código para conseguir que. (además de que no se ve bien) Así que me preguntaba si hay una solución para este problema específico.

OriginalEl autor Ivar Reukers | 2017-01-09

1 Comentario

  1. 0

    Si usted proporciona el atributo:

    formControlName = «el control de formulario de aquí el nombre de»

    en la entrada, a continuación, pueden co-existir como tal;

    <input type="password"
           [(ngModel)] = "password"
           formControlName = "password"/>

    La formControlName debe coincidir con el nombre proporcionado en su FormGroup

    this.formGroup = this._formBuilder.group({
      'password': new FormControl(this.password, [
         Validators.required,
         Validators.minLength(4)
      ])
    });
    Aviso – Soporte para el uso de la ngModel entrada de la propiedad y ngModelChange evento con forma reactiva directivas ha sido desaprobado en Angular v6 y será eliminado en Angular v7.

    OriginalEl autor Stacker-flow

Dejar respuesta

Please enter your comment!
Please enter your name here