I am new to Angular and I have a Reactive Forms with AbstractControl
that subscribe for valueChange
to listen for any values change in input field. Inside the subscribed function I want to change the value of the input under a certain condition.
this.abstractControl.valueChanges.subscribe(data => {
...
if(.....) {
this.formGroup.patchValue({
name: result
)}
}
...
}
I tried to use this.abstractControl.setValue(result)
does'nt work too.
I get an error in setting the value.
ERROR RangeError: Maximum call stack size exceeded
What is the recommended way of listening to a value change and changing the value accord to a condtion?
The ValueChanges is an event raised by the Angular forms whenever the value of the FormControl, FormGroup or FormArray changes. It returns an observable so that you can subscribe to it. The observable gets the latest value of the control. It allows us to track changes made to the value in real-time and respond to it.
Here's a quick way you can do this check using Object. keys(). This will check the properties in the value object that represents your form state, and return true if any of those properties are truthy, i.e. have a value.
Setting or Updating of Reactive Forms Form Control values can be done using both patchValue and setValue. However, it might be better to use patchValue in some instances. patchValue does not require all controls to be specified within the parameters in order to update/set the value of your Form Controls.
These reactive form instances like FormGroup and FormControl have a valueChanges method that returns an observable that emits the latest values. You can subscribe to valueChanges and perform your app logic over there. Let’s take a very simple example of valueChanges in our reactive form.
FormControl. The ValueChanges is an event raised by the Angular forms whenever the value of the FormControl, FormGroup or FormArray changes. It returns an observable so that you can subscribe to it. The observable gets the latest value of the control.
These reactive form instances like FormGroup and FormControl have a valueChanges method that returns an observable that emits the latest values. You can subscribe to valueChanges and perform your app logic over there.
statusChanges is a property of AbstractControl that emits an event every time when the validation status of the control is recalculated. statusChanges property is available in FormControl, FormArray and FormGroup classes because they inherit AbstractControl class. statusChanges property has been declared as following.
@jonrsharpe thanks. Problem resolved with emitEvent: false
.
Read: angular.io/api/forms/FormControl#setValue
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With