0

i need some help to work with regex on ngx Mask.

I'm trying to set a mask to my Lat,Lon google coords input with a custom regex.

-5.57455948, -70.5165755

This Regex fit the entire input: /^([-+]?[1-8]?\d(?:\.\d+)?|90(?:\.0+)?),\s*([-+]?(?:180(?:\.0+)?|(?:(?:1[0-7]\d)|(?:[1-9]?\d))(?:\.\d+)?))$/

Test for regex: Regex101.com

My .ts code

customPatterns = {
    'l': { pattern: new RegExp('/^([-+]?[1-8]?\d(?:\.\d+)?|90(?:\.0+)?),\s*([-+]?(?:180(?:\.0+)?|(?:(?:1[0-7]\d)|(?:[1-9]?\d))(?:\.\d+)?))$/') }
  }; 

My html code:

<input id="coordenadas_iniciais" placeholder="-22.4567,-45.2345" matInput
                formControlName="coordenadas_iniciais" showMaskTyped="true" mask='l' [patterns]="customPatterns" required>

StackBlitz Teste

This not work.

  • You should not use regex literals inside string literals. Try `pattern: /^([-+]?[1-8]?\d(?:\.\d+)?|90(?:\.0+)?),\s*([-+]?(?:180(?:\.0+)?|(?:(?:1[0-7]\d)|(?:[1-9]?\d))(?:\.\d+)?))$/` – Wiktor Stribiżew Apr 07 '21 at 21:55
  • Can you provide more information on "This not work"? Is there an error message or just no match of the regex? The latter case worked in your regex101 example so it can't be entirely wrong. – shaedrich Apr 08 '21 at 07:27
  • @WiktorStribiżew Didn't work, maybe ngx-mask not work with full regex, need to split. But i don't find a solution yet. – Luiz Gabriel Parreira Pereira Apr 08 '21 at 12:26
  • @shaedrich regex works, but my aproach using on ngx-mask don't. I cant type anithing in input this way. – Luiz Gabriel Parreira Pereira Apr 08 '21 at 12:26
  • `ng-mask` only allows validating each char *separately*, without knowing the surrounding context. You can't use `ng-mask` to validate on the fly *multi-character sequences*. You need a separate directive for that, I believe. – Wiktor Stribiżew Apr 08 '21 at 22:04
  • @WiktorStribiżew YEah, i think you right. I will try to do this. but i don't undestando so much regex. Thanks for now. – Luiz Gabriel Parreira Pereira Apr 09 '21 at 12:15

0 Answers0