Saltar al contenido

Formas reactivas angulares: rechace solo algunos controles de forma específicos

Solución:

Cree cada FormControl individual antes de agregarlos al grupo de formularios y luego puede controlar el valueChanges observable por FormControl

this.textInput.valueChanges
      .pipe(
        debounceTime(400),
        distinctUntilChanged()
      )
      .subscribe(res=> {
        console.log(`debounced text input value ${res}`);
      });

distintivoUntilChanged se asegurará solo cuando el valor sea diferente para emitir algo.

El rebote para un solo control en un grupo de formularios se puede realizar mediante

   this.form.get('textInput')
  .valueChanges
  .pipe(debounceTime(500))
  .subscribe(dataValue => {
    console.log("dataValue", dataValue);
  });

Ahora mismo tenía ese problema, ¡lo resolví de la siguiente manera!

// Reactive control
fieldOne = this.formBuilder.control('');

// Reactive form
formGroup = this.formBuilder.group({
  fieldOne: [],
  fieldTwo: [],
  fieldX: [],
});

this.fieldOne.valueChanges
  .pipe(debounceTime(300))
  .subscribe(value => {
    this.formGroup.get('fieldOne').setValue(value);
  });

tiene velocidad de respuesta en los controles dentro del grupo de formularios y un retraso en los eventos emitidos desde el control individual, es de esperar que en el futuro el valueChanges emitido por formGroup presente el control que desencadenó el evento y podrá usar el filtro en el observable

¡Saludos!

¡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 *