從正則表達式角度創建自定義驗證器反應形式

Question

我在電子郵件表單上使用了一些正則表達式驗證，這就是它的外觀

this.customerForm = this.fb.group({
      email: [null, {
        Validators.pattern('^[^\\s@]+@[^\\s@]+\\.[^\\s@]{1,}$')],updateOn: 'blur'
      }]
    });

Answer 1

當您將表達式定義為字符串時，您必須轉義反斜杠，就像您在Validators.pattern('^[^\\\\s@]+@[^\\\\s@]+\\\\.[^\\\\s@]{1,}$')<\/code> 。

但是，如果您將表達式定義為正確的正則RegExp<\/code> ，就像您在驗證器函數中所做的那樣，您不能這樣做，因為它會嘗試將其匹配為反斜杠字符。 因此，您需要按如下方式修改您的RegExp<\/code> 。

const nameRe = /^[^\s@]+@[^\s@]+\.[^\s@]{1,}$/;

Answer 2

如果您使用的是響應式表單，那么您可以在創建表單時直接放入。

 filterForm: FormGroup; filterForm = formBuilder.group({ firstName: [null], lastName: [null], zipCode: [null, [Validators.pattern('[0-9]{5}')]] });