Solución:
distinctUntilChanged
cuando se aplica a la valueChanges
observable…
… ¡probablemente nunca va a funcionar!
Solo funciona como se esperaba en un valor individual (como dijiste). De modo que obtendrá un nuevo valor incluso si nada ha cambiado.
Para realizar un seguimiento de los cambios de todo el formulario, debe escribir un comparador personalizado, el más simple de los cuales utiliza JSON.stringify
para generar un valor que se pueda comparar. los valueChanges
observable emite un objeto y distinctUntilChanges
no es lo suficientemente inteligente como para hacer algo más que una comparación de referencia (es un enlace al código fuente de RxJS) a menos que proporcione una función de comparación.
this.form.valueChanges.pipe(distinctUntilChanged((a, b) => JSON.stringify(a) ===
JSON.stringify(b)))
.subscribe(changes => { console.log('The form changed!'); });
distinctUntilChanged
funciona bien para un valor individual con un tipo primitivo porque ===
es suficiente para detectar cambios.
¿Cómo resuelvo bucles infinitos?
Si estás intentando agregar distinctUntilChanges
en su tubería (para todo el formulario) para evitar un bucle infinito cuando actualiza programáticamente el valor del formulario; probablemente desee esto en su lugar:
this.form.patchValue(address || {}, { emitEvent: false });
Utilizando debounceTime(1000)
significa que solo enviamos una solicitud cuando el usuario dejó de escribir durante 1 segundo, durante ese segundo, el usuario puede escribir 3 caracteres y luego borrarlos, por lo que el valor de entrada no cambió desde la última solicitud, pero está enviando la misma solicitud, para evitar eso puedes usar .distinctUntilChanged()
this.myFormControl.valueChanges
.debounceTime(1000)
.distinctUntilChanged()
.subscribe(newValue => {
console.log('debounced: ', newValue)
});