Dynamically changing [inputMask] variable not updating input
GKersten opened this issue Β· comments
I'm submitting a...
[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request
[ ] Other... Please describe:
Current behavior
Whenever I update the variable bound to the [inputMask]
directive, it is not updating the actual mask on the input
Expected behavior
Expect that when I make changes to the variable it would actually update the mask that is being used on the input.
Minimal reproduction of the problem with instructions
Created a Reproduction on Stackblitz you can see whenever you try to change the [inputMask]="textInputMask"
it will not update the mask for the input. Only when you enable the work-around in the .ts file. You will see I force the refresh of the input to make it actually work.
What is the motivation / use case for changing the behavior?
Would make sense to listen for @ Input variables
Environment
Angular version: 11.2.13
Browser:
- [x] Chrome (desktop) version 95.0.4638.69
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
This is quite difficult and time-consuming. PR is most welcome. I started working on some time back, it's at https://github.com/ngneat/input-mask/tree/feature/handle-changes if you want to have a look.
I think you should take advantage of this change and add the ability to add or remove the mask by the result of a function.
Today if I pass "null", an error occurs
ERROR TypeError: Cannot read properties of undefined (reading 'parser')
at InputMaskDirective.registerOnChange (ngneat-input-mask.js:78)
at setUpViewChangePipeline (forms.mjs:1677)
at setUpControl (forms.mjs:1538)
at NgModel._setUpStandalone (forms.mjs:4512)
at NgModel._setUpControl (forms.mjs:4500)
at NgModel.ngOnChanges (forms.mjs:4460)
at NgModel.rememberChangeHistoryAndInvokeOnChangesHook (core.mjs:1506)
at callHook (core.mjs:2543)
at callHooks (core.mjs:2502)
at executeCheckHooks (core.mjs:2434)
How are we supposed to work around this?
The release is available on:
Your semantic-release bot