MrWolfZ / ngrx-forms

Enhance your forms in Angular applications with the power of ngrx
MIT License
374 stars 111 forks source link

Add NgrxValueConverter.convertStateToView trigger when input changes focus. #258

Open AtozEvo opened 2 years ago

AtozEvo commented 2 years ago

(Not sure if this should be an enhancement or issue)

Is your feature request related to a problem? Please describe. A form that i am working on relies on monetary inputs (eg: 0.00 or 19.99). Since prices are numeric values to do other calculations, we created the form control where price is number type. Using NgrxValueConverter we are able to convert view and state data types as expected. But this doesn't work as expected after the user changes the values, from 0.00 to 19 for example. The view stays as '19' even though the state as been updated to the correct value 19 (as number).

Describe the solution you'd like I would have thought that after input changes, the view/input's value would be updated with the 'convertStateToView' function.

Describe alternatives you've considered The current work around is to have all my 'price/monetary' fields to be in string format and do the numeric conversion ( (parsefloat(value) || 0) either in the selector, or enabling focus tracking for the input, and then running the formatting with onNgrxFormsAction in the reducer, or doing something similar, but with userDefinedProperties instead of converting the value in the selector.

I find this a little over complex when there is a 'value converter' function available. (which catered for 95% of the expected behavior)

Additional context I undestand the issue with Inputs where when the value changes, the cursor moves to the end of the value. So I looked through the code for formControlState to see when does the convertStateToView function get called, and is only called when value/id of the control changes. I was thinking if adding convertStateToView to convert the state value on blur, the view value will get updated to reflect the convertStateToView format/value, and it wouldn't interfere with the user's input as the type.

Are there any scenarios where updating the view value on blur will cause issues? 🤔

Version ngrx-forms: ^6.3.5

Side note Kinda waiting for ngrx-forms to start using the newer ngrx functions for action (createAction) so there's an easier way to manage my form actions in ngrx/effects 😄 (As a workaround, I currently have a 'util' actions file which creates and action using ngrx/store's createAction function that has identical TYPE/type to ngrx-forms actions. 🤷‍♂️ )

AtozEvo commented 2 years ago

I understand that you're not actively working on this as of now @MrWolfZ, but would it be possible to get your input on this? If you think it's okay, i would love to create a PR.

MrWolfZ commented 2 years ago

I'm not sure yet I fully understand the issue. Why does it matter if the view value is a string? In HTML number inputs, the value will always be a string, unless you explicitly use .valueAsNumber. Could you please clarify?

Also, on the createActions topic, somebody started working on this, but I think they gave up because it turned out to be quite a lot of work (they also started refactoring the internal reducers etc.). However, from what you describe you simply have a thin wrapper around the ngrx-forms actions so nothing internally would need to change. If you are willing to share those wrappers I could include them in the library.