角度2反応性パターンパターンバリデーター; Ignoring Case

Question

In Angular 2.1.0 Reactiveフォームでは、パターンバリデーターを使用してフィールドの1つを検証しようとするformBuilderグループ関数を使用するフォームがあります。

this.profileForm = this.formBuilder.group({ 
'email': [this.profile.email, [ 
      Validators.pattern('^[a-z0-9A-Z_]+(\.[_a-z0-9A-Z]+)*@[a-z0-9-A-Z]+(\.[a-z0-9-A-Z]+)*(\.[a-zA-Z]{2,15})$') 
     ]], 
//... 

あなたが見ることができるように私は手動でグループに大文字のA-Zを追加したが、ケースを無視するパターンのバリデータを指定する方法がある場合、私は思っていました。私はオンラインで例を見つけることができないようで、実際のRegExpオブジェクトを渡すことはできませんが、文字列でなければなりません。

Answer 1

より最近のバージョンのAngularでは、この問題が修正され、Validators.pattern関数はRegExpオブジェクトを受け入れます。

このバージョンでは、カスタム検証クラスを作成し、独自のパターン関数を追加してRegExpオブジェクトを受け入れました。次のようになります。

import { AbstractControl, ValidatorFn } from '@angular/forms'; 
export class CustomValidators { 

    public static pattern(reg: RegExp) : ValidatorFn { 
     return (control: AbstractControl): { [key: string]: any } => { 
      var value = <string>control.value; 
      return value.match(reg) ? null : { 'pattern': { value } }; 
     } 
    } 
} 

そして、このバリデータを参照しているフォームは次のようになります。

this.profileForm = this.formBuilder.group({ 
     'firstName': [{ value: this.profile.firstName, disabled: true }], 

     //... other fields 

     'email': [this.profile.email, [ 
      CustomValidators.pattern(/^[a-z0-9_]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,15})$/ig) 
     ]], 

     //...other fields 

    });