Question

我有这个代码，它只接受6位数字：

<input
   ng-pattern="{{widget.regex}}" 
   name="{{widget.id}}">
{{widget.regex}}

<span ng-if="(myForm[item.id].$touched === true && myForm[item.id].$valid === false)" class="help-block">
    <div ng-message="pattern">Enter 6 digit ID</div>
</span>

正在从JSON文件设置正则表达式值，如下所示：

{
  "items": [
    {
      "id": "customerID",
      "label": "Enter ID",
      "required": "yes",
      "regex": "/^[0-9]{6,6}$/i"
    },
    {
      "id": "customerEmail",
      "label": "Email",
      "required": "yes"
    }
  ]
},

以及输出：

现在的问题是，如果我在ID字段中键入6位数字，则错误消息不会消失。我输入的任何数字都不会成功。但是，如果我将正则表达式硬编码为ng-pattern这样的属性：

<input
   ng-pattern="/^[0-9]{6,6}$/i" 
   name="{{widget.id}}">
{{widget.regex}}

<span ng-if="(myForm[item.id].$touched === true && myForm[item.id].$valid === false)" class="help-block">
    <div ng-message="pattern">Enter 6 digit ID</div>
</span>

它会起作用！错误消息将消失。我也从控制器测试过它：

vm.regex = new RegExp('/^[0-9]{6,6}$/i');

它也没有用。谁知道问题是什么？请提前帮助和谢谢。

Answer 1

RegExp构造函数可以用两种方式表示：

new RegExp('ab+c', 'i');   //string notation
new RegExp(/ab+c/i);   //literal regex notation

注意字符串表示法没有/字符，但文字表示法没有。

如果包含/字符，

ng-pattern会自动将字符串输入转换为文字表示法。如果它检测到没有包含/字符的字符串，则将其包装在^和$字符中。例如。 "abc"将转换为new RegExp('^abc$')，但"/abc/i"将评估为new RegExp(/abc/i)。

参考文献：

使用ng-pattern不适用于控制器或JSON

1 个答案: