How do I get this custom validator to work?

Question

Having trouble with a custom validator pattern. The essential elements for a successful validation should be 1) At least 1 number at the beginning 2) a space after the number/numbers 3) At least 1 alpha character that represents the street name. Anything appended beyond that should still validate as true.

this.myForm = this.fb.group({
      street:['',[Validators.required, Validators.pattern(/^\d+\s*[a-zA-Z].*$/ig)]],
      city:['',Validators.required],
      state: ['', Validators.required],
      zip:['',Validators.required],
      notes:[''],
    })

44 North Road #12 validates but 44 North Road #123 Does not. Essentially after I type in 44 North Road every other character typed in (no matter what it is) makes the it fail validation until a subsequent character is entered and then fails again as the next character is typed. It just ping pongs back and forth between invalid and valid as I add characters.

What am I doing wrong?

Answer 1

I believe your regex is a little off. Here is a simpler expression that matches your criteria:

^\d+\ [A-Za-z].*$

• \d+: one digit
• \ (space afteer \): space
• [A-Za-z]: one alpha character
• .* anything else

You can see it in action here, where I added capture groups around your 3 specific criteria.