CODEWITHSUNDEEP
angularregextypescriptvalidation
ChungWu
ChungWu

Reputation: 39

Pattern matching issue in Angular 14 regex validator

I am having an issue with pattern matching validation in angular 14. I have a dynamic text component that can support multiple different types of text input and custom pattern validation can be appended if need be. Here is the setup of a text box for type=monetary

        case InputType.Monetary:
          response.icon = response.icon ?? 'attach_money-outlined';
          response.iconPosition = response.iconPosition ?? LayoutPositions.Left;
          response.placeholder = response.placeholder ?? '0.00';
          response.validationPattern = response.validationPattern ?? /^(\d{1,3}(,\d{3})*|(\d+))(.\d{2})?$/gm;
          response.patternErrorText = response.patternErrorText ?? 'Please enter a valid dollar amount';
          response.mask = response.mask ?? this.currencyInputMask;
          break;

And here is how it is being applied

      if (response?.validationPattern) {
        this.form.get(response.responseId)?.setValidators(Validators.pattern(response.validationPattern));
      }

The issue I am facing is that when there is an Even number of characters in this text field it is showing invalid no matter what. And when there is an Odd number of characters in the text field it seems to be working as expected. I have vetted out the regex and I don't believe that is the issue. Attached are some screenshots of the issue

Invalid State UI

Invalid State Back End

Valid State UI

Valid State Back End

I have tried

Upvotes: 1

Views: 449

Answers (1)

ChungWu
ChungWu

Reputation: 39

bobble bubble was able to solve this for me. The issue was the addition of the m (multiline) at the end of my regex. removing it solved the issue.

Upvotes: 0

Related Questions