常用輸入框驗證(使用正則匹配)

  • 使用方法:

使用string.match(reg)匹配到不符合規則的值會返回會NULL

// 初始化表單數據
    this.mainForm = this.fb.group({
      id: [null, [Validators.required,this.contentValidators(/^[a-zA-Z0-9_]{1,}$/)]]
    });
/**
   * 輸入字符內容檢驗
   */
  private contentValidators(reg: RegExp) {
    const contentValidator = (control: FormControl): { [s: string]: boolean } => {
      if (control.value && !control.value.match(reg)) {
        return {matchErr: true, error: true};
      } else {
        return {};
      }
    };
    return contentValidator;
  }
  • 正則匹配規則

1.僅支持字母數字下劃線

/^[a-zA-Z0-9_]{1,}$/

2.正整數

/^[1-9]\d*$/

3.輸入的字母數字長度限制在 6-7

/^[A-Za-z0-9]{6,7}$/

4.大於等於0, 小於等於150, 支持小數位出現5, 如145.5

/^150$|^(?:\d|[1-9]\d|1[0-4]\d)(?:.5)?$/

5.24小時制時間(HH:mm:ss)

/^(?:[01]\d|2[0-3]):[0-5]\d:[0-5]\d$/

6.12小時制時間(hh:mm:ss)

/^(?:1[0-2]|0?[1-9]):[0-5]\d:[0-5]\d$/

7.數字/貨幣金額(支持負數、千分位分隔符)

/(?:^[-]?[1-9]\d{0,2}(?:$|(?:,\d{3})*(?:$|(\.\d{1,2}$))))|(?:(?:^[0](\.\d{1,2})?)|(?:^[-][0]\.\d{1,2}))$/

不支持千分位分隔符

/(?:^[1-9]([0-9]+)?(?:\.[0-9]{1,2})?$)|(?:^(?:0){1}$)|(?:^[0-9]\.[0-9](?:[0-9])?$)/

8.中國手機號

/^(?:(?:\+|00)86)?1\d{10}$/

9.日期

/^\d{4}(-)(1[0-2]|0?\d)\1([0-2]\d|\d|30|31)$/

10.郵箱地址(email)

/^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/

11.密碼強度正則,最少6位,包括至少1個大寫字母,1個小寫字母,1個數字,1個特殊字符

/^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章