Angular2/4電話驗證

Question

我正試圖在Angular 2/4中實現一個表單。有一個電話號碼字段。我用正則表達式爲

pattern="^\s*(?:\+?(\d{1,3}))?[- (]*(\d{3})[-)]*(\d{3})[- ]*(\d{4})(?: *[x/#]{1}(\d+))?\s*$" 

在相應的輸入字段中。它接受幾乎所有的格式，但不執行以下操作：

1. 754-3010（本地）

2. （541）754-3010（國內）

3. + 1-541-754- 3010（國際）

更重要的是它應該接受+， - ，（和）字符。

希望有人能幫助

Answer 1

您可以將使用可選的非捕獲組正則表達式可選的一部分。

使用

^\s*(?:\+?\d{1,3})?[- (]*\d{3}(?:[-)]*\d{3})?[- ]*\d{4}(?: *[x/#]\d+)?\s*$ 
           ^^^   ^^ 

見regex demo

注意{1}是多餘的，你可以將其刪除。

至於捕捉小組，如果您需要它們，您可以保留原有的小組，但如果您只是驗證，我寧願刪除它們。

詳細

• ^ - 串的開始
• \s* - 0+空格
• (?:\+?\d{1,3})? - 的可選序列：
  • \+? - 任選的（1或0 ）+符號
  • \d{1,3} - 任何1至3位數
• [- (]* - 一個-，空間或(
• \d{3} - 任何3位數字
• (?:[-)]*\d{3})? - 的可選序列： - 0+ -
  • [-)]* ，空格或)
  • \d{3} - 任何3迪GITS
• [- ]* - 0+空格或-
• \d{4} - 任何4位數字
• (?: *[x/#]\d+)?
• \s* - 0+空格
• $ - 字符串的結尾。