I'm trying to configure angular-imask for a field, but it won't let me input the last digit in year. It presents the mask correctly and I can type fine but it blocks further typing after 3rd digit. This is the mask I'm using:
imaskDate = {
mask: Date,
pattern: 'd/`m/`Y', // Pattern mask with defined blocks, default is 'd{.}`m{.}`Y'
blocks: {
d: {
mask: IMask.MaskedRange,
from: 1,
to: 31,
maxLength: 2,
},
m: {
mask: IMask.MaskedRange,
from: 1,
to: 12,
maxLength: 2,
},
Y: {
mask: IMask.MaskedRange,
from: 1900,
to: 9999,
}
},
lazy: false,
};
I couldn't make the code work in code snippet. It's working here:
https://stackblitz.com/edit/angular-tzovqf
Anyone knows what's happening here ?
EDIT
This is a question that was inactive for 2 1/2 years. I don't remember exactly what was happening at the time and I couldn't reproduce the problem now. I think this may be due to some older browser versions and/or libs. So I can't accept any of the answers.
Following the advices in this meta question and as this question is receiving answers now, I won't delete it.
I ask @iateadonut and @abdessamad-aboukdir that answered to please post the environment where this problem is still happening so I can try to reproduce the problem again. Browser version, OS, Angular version and any relevant info.
I will only accept an answer when someone can provide evidence of how can I create an example of this problem happening or a working example where the problem is occurring. Otherwise it will remain active but unanswered.
If any moderator thinks I should take any other action, feel free to give any instructions you'd like.
I could not get it to work with the Date mask, but this works (from the github page: https://github.com/uNmAnNeR/imaskjs/issues/557 ):
const maskProps = {
mask: 'd/m/Y',
lazy: false,
overwrite: true,
autofix: true,
blocks: {
d: { mask: MaskedRange, placeholderChar: 'd', from: 1, to: 31, maxLength: 2 },
m: { mask: MaskedRange, placeholderChar: 'm', from: 1, to: 12, maxLength: 2 },
Y: { mask: MaskedRange, placeholderChar: 'Y', from: 1900, to: 2999, maxLength: 4 },
},
}
Add autofix: true
to your mask, to adapt the value to the accepted range of each block
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