Currently, I am utilizing angular-redux/form to capture my form data and I have validators in the reducer in order to keep all my logic within the reducer. Each time a value is entered into the form, my reducer listens to the @@angular-redux/form/FORM_CHANGED action that is fired by angular-redux/form and then performs validations against the inputs and changes state accordingly to give messages or whatever. Everything works great, except that the reaction is instantaneous and I would like the ability to debounce the user entries so they don't get insta-error messages for a better user experience.
I could accomplish this by subscribing to the .onValueChanges on the form with a debounce, which then fires off a custom action, which then does the validation. This seemingly defeats most of the purpose of the angular-redux/form and seems like extra work when I could just listen to the @@angular-redux/form/FORM_CHANGED and check the payload.path in order to determine what form is being acted upon. Additionally, it adds even more action spam in the store, when I feel like a simple debounce would create less, allow one to utilize the strengths of angular-redux/form [less work], and give the desired effect. [Do you have any better suggestions on how to handle this?]
It would make sense to offer a feature within angular-redux/form that allows specific inputs to be debounced instead of every keystroke instantly saving to the store (so the actual dispatch action is delayed).
This is a...
What toolchain are you using for transpilation/bundling?
@angular/cli
Environment
NodeJS Version: 6.10.0 Typescript Version: 2.5.3 Angular Version: 4.2.0 @angular-redux/store version: 6.5.7 @angular/cli version: (if applicable): 1.4.7 OS: Windows
Issue and Propsal
Currently, I am utilizing
angular-redux/form
to capture my form data and I have validators in the reducer in order to keep all my logic within the reducer. Each time a value is entered into the form, my reducer listens to the@@angular-redux/form/FORM_CHANGED
action that is fired byangular-redux/form
and then performs validations against the inputs and changes state accordingly to give messages or whatever. Everything works great, except that the reaction is instantaneous and I would like the ability to debounce the user entries so they don't get insta-error messages for a better user experience.I could accomplish this by subscribing to the
.onValueChanges
on the form with a debounce, which then fires off a custom action, which then does the validation. This seemingly defeats most of the purpose of theangular-redux/form
and seems like extra work when I could just listen to the@@angular-redux/form/FORM_CHANGED
and check thepayload.path
in order to determine what form is being acted upon. Additionally, it adds even more action spam in the store, when I feel like a simple debounce would create less, allow one to utilize the strengths of angular-redux/form [less work], and give the desired effect. [Do you have any better suggestions on how to handle this?]It would make sense to offer a feature within
angular-redux/form
that allows specific inputs to be debounced instead of every keystroke instantly saving to the store (so the actual dispatch action is delayed).