ngneat / input-mask

🎭 @ngneat/input-mask is an angular library that creates an input mask

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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)
commented

How are we supposed to work around this?

πŸŽ‰ This issue has been resolved in version 5.2.0 πŸŽ‰

The release is available on:

Your semantic-release bot πŸ“¦πŸš€