Saltar al contenido

Eliminar validadores del control de formulario Angular 6

Solución:

Prueba esto:

this.addProjectForm.get('title').setValidators([]); // or clearValidators()
this.addProjectForm.get('title').updateValueAndValidity();

Si desea agregar un validador, agregue una matriz de validadores:

this.addProjectForm.get('title').setValidators([Validators.required]);
this.addProjectForm.get('title').updateValueAndValidity();

Nota: debe usar updateValueAndValidity () después de cada cambio

Puede intentar seguir como otra solución si desea eliminar el validador de su campo:

public saveDraft(): void {
   this.addProjectForm.get('title').clearValidators();
   this.addProjectForm.get('title').updateValueAndValidity();
}

He implementado bastantes formularios con esta funcionalidad Guardar como borrador.

Lo que hago generalmente es mantener el botón Enviar deshabilitado a menos que el formulario esté valid. Pero mantenga el botón Guardar como borrador como siempre habilitado.

Lo que esto me permite hacer es guardar el contenido del formulario sin aplicar ninguna validación en caso de que el usuario haga clic en el botón Guardar como borrador.

El usuario no puede hacer clic en el botón Guardar de todos modos, ya que el formulario no es válido.

Todo esto se traduce en un código como este:

<div class="image-flip">
  <div class="mainflip">
    <div class="frontside">
      <div class="card">
        <div class="card-body add-generic-card">

          <form [formGroup]="addGameForm">
            ...

            <div class="draft-publish-button">
              <button 
                class="..." 
                type="button" 
                (click)="onFormSubmit('DRAFT')">
                  Save as Draft
              </button>

              <button 
                class="..." 
                type="button" 
                (click)="onFormSubmit('PUBLISHED')" 
                [disabled]="addGameForm.invalid">
                  Publish
              </button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *