Angular 6 url pattern validator

Question

In an input form Angular 6 I want to check if the input url supposed to contain the Facebook url really is a valid url which contains as substring either the string “facebook.com” or “fb.me” and if it is not the case return an error message.

Im stuck with the following:

<div nxRow>
  <div nxCol="12">
    <nx-formfield nxStyle='negative' nxLabel="FACEBOOK">
      <input nxInput type="url" ng-model="facebook" pattern="^.*facebook.com*$/" value="{{facebook}}">
      <span nxFormfieldHint>
                  Link zur Facebook
              </span>
    </nx-formfield>
  </div>
</div>

You're asking about Angular 6 but there's AngularJS (1.x) syntax in your code - which version are you using? — barbsan, Jun 21 '18 at 12:51
Angular 6, my problem is that pattern is not affecting anything — mattobob, Jun 21 '18 at 12:52

score 1 · Accepted Answer · answered Jun 21 '18 at 14:44

1

You could try adding a dot before the * like ^.*facebook.com.*$ to match any character zero or more times.

Right now you are repeating the m zero or more times.

To check if the string contains either facebook.com of fb.me you might use an alternation:

^.*(?:facebook\.com|fb\.me).*$

answered Jun 21 '18 at 14:44

The fourth bird

154,723
16
55
70

No particular experience on that part but perhaps [this page](https://stackoverflow.com/questions/49626203/what-will-be-the-custom-validator-for-password-pattern-checking-having-at-least) might be helpful. – The fourth bird Jun 21 '18 at 15:26
Hey man, is there a way to obtain the same result and avoid combination with withespaces? – mattobob Jun 25 '18 at 07:26

Angular 6 url pattern validator

1 Answers1