Angular Validator Pattern 适用于 HTML，但不适用于 TypeScript答案

【问题标题】：Angular Validator Pattern works in HTML but not in TypeScriptAngular Validator Pattern 适用于 HTML，但不适用于 TypeScript
【发布时间】：2019-03-22 09:59:09
【问题描述】：

以下正则表达式在 HTML 中确实有效，如下例所示：

<input type="text" formControlName="mgmtIP" class="input-text" pattern="([01]?\d\d?|2[0-4]\d|25[0-5])\.([01]?\d\d?|2[0-4]\d|25[0-5])\.([01]?\d\d?|2[0-4]\d|25[0-5])\.([01]?\d\d?|2[0-4]\d|25[0-5])">

但如果我想将该模式放入 FormGroup 中，验证器将无法识别：

mgmtIP: [host.mgmtIP, [
            Validators.required,
            Validators.pattern(/^([01]?\\d\\d?|2[0-4]\\d|25[0-5])\\.([01]?\\d\\d?|2[0-4]\\d|25[0-5])\\.([01]?\\d\\d?|2[0-4]\\d|25[0-5])\\.([01]?\\d\\d?|2[0-4]\\d|25[0-5])$/)
          ]],

我试着把它放在一个字符串中，去掉^和$。那也没用

【问题讨论】：

在/.../ 正则表达式文字中使用单个反斜杠。 Validators.pattern(/^(?:[01]?\d\d?|2[0-4]\d|25[0-5])(?:\.(?:[01]?\d\d?|2[0-4]\d|25[0-5])){3}$/)
@WiktorStribiżew 也不起作用。我认为验证器甚至没有被应用程序识别。
我会说你实际上必须删除那些。
@Antoniossss 我尝试了 Wiktor 给我的例子。它没有用。
验证同时适用于 HTML 模式和 Validators.pattern()。同时使用/ 的反斜杠或“字符串”适用于Validators.pattern()。 @N。 Richli，如果您仍然遇到问题，请在 stackblitz 上创建一个示例。

标签： regex angular validation

【解决方案1】：

好的，我找到了这个问题的答案。我只是愚蠢：我在表单数组中有一个带有验证器的初始表单。然后我在那里推了一些新的表单组，这些验证器没有配置。无论如何感谢您的帮助！

【讨论】：

【解决方案2】：

我个人不会为此使用正则表达式，因为它会混淆代码并且难以调试（您现在知道这一点）。检查 ip 有效性的更简单方法是：

仅允许 [0-9.]
由.拆分
检查段是否不为空且在范围内

我并不是说正则表达式对此不可行，但为了可维护性，我不会这样做（或使用经过良好测试的正则表达式）。

【讨论】：

OP 没有正则表达式问题。