candreoliveira / ngMask

Best Angular mask alternative! No jQuery, pure JS. About ~6kb!
http://candreoliveira.github.io/#/ngMask
ISC License
419 stars 171 forks source link

Restrict: 'select' does not work inside transclude #130

Open ghost opened 7 years ago

ghost commented 7 years ago

When using the 'select' mode for the restrict option, the expected behavior when inputting an invalid character is that it should be highlighted that way the next character input replaces it. When an ng-mask element with this option is used within a transclude block, the 'select' mode does not work as expected and it instead works like the 'accept' option.

I have created a codepen to demonstrate this behavior. The mask is set as "99-99-99". Here are the steps to reproduce within the codepen:

1) Visit http://codepen.io/anon/pen/xqxrrj 2) Focus the input labelled "Outside transclude" 3) Enter the character 'z'. This is an invalid character for the mask so ng-mask selects the character automatically. 4) Enter the character 'z'. This character replaces the previous character because of the automatic selection in step 3. This works as expected 5) Focus the input labelled "Inside transclude" 6) Enter the character 'z'. This is an invalid character for the mask but ng-mask did not select the character 7) Enter the character 'z'. This character is appended to the end of the input since the automatic selection did not happen in step 6 as expected.

These two inputs should behave the same, but for some reason the second input behaves differently since it is inside a transclude block.