urlValidator & httpsValidator

Overview

The urlValidator and httpsValidator functions are Angular validators used to check if a given string adheres to specific URL patterns. These validators can be utilized in Angular Reactive Forms to ensure the validity of user-entered URLs.

Usage

import {httpsValidator, urlValidator} from 'ngx-lift';

@Component({
  standalone: true,
  imports: [ReactiveFormsModule],
  template: `
    <form [formGroup]="form">
      <div>
        <label>
          URL
          <input type="text" formControlName="url" />
        </label>
        <div *ngIf="form.controls.url.hasError('required')">Required</div>
        <div *ngIf="form.controls.url.errors?.['invalidUrl']">Please enter a valid URL</div>
      </div>

      <div>
        <label>
          Https-only URL
          <input type="text" formControlName="https" />
        </label>
        <div *ngIf="form.controls.url.hasError('required')">Required</div>
        <div *ngIf="form.controls.url.hasError('invalidUrl')">Please enter a https URL</div>
      </div>
    </form>
  `
})
export class UrlValidatorComponent {
  form = new FormGroup({
    url: new FormControl('', [Validators.required, urlValidator]),
    https: new FormControl('', [Validators.required, httpsValidator]),
  });
}