如何使用ngPattern验证包含受限字符的输入？

问题描述：

我尝试验证受限字符的输入。输入字段只接受字母，短划线和下划线字符。如何使用ngPattern验证包含受限字符的输入？

当我测试下面的代码，所述第一字符被接受，但第二个提出的图案误差。

我正则表达式：/^ [A-ZA-Z _-] $/

HTML代码：

<input ng-model="inputText" name="inputText" required md-maxlength="{{options.maxTextLength}}" md-autofocus ng-keypress="keypress($event)" ng-change="textChanged()" ng-pattern='/^[a-zA-Z_-]$/'> 
<div ng-messages="inputTextForm.inputText.$error"> 
    <div ng-message="required">Input is required.</div> 
    <div ng-message="md-maxlength">Input has reached the maximum characters allowed.</div> 
    <div ng-message="pattern">Invalid characters.</div> 
</div>

此代码是在角度材料对话框（v1.0.9）

答

一个以上的字符，你需要*在模式的结束，即：

<input ... ng-pattern="/^[a-zA-Z_-]*$/" /> 
<!--        ^ --> 
<!--        | --> 
<!--    HERE -------------+ -->

见琴：https://jsfiddle.net/5wa5478c/

非常感谢！ –

我有一个问题，也许你可以回应。此ng模式需要动态并由控制器根据上下文进行设置。如果我试图绑定这个正则表达式，它不起作用。如果我删除了斜线，它就会起作用... –

您可以这样做：''，其中'pattern'放置在控制器的范围内。请参阅https://jsfiddle.net/xsvpmp6c/ –

答

有了这个，这个正则表达式指示有效输入是一行（^）的开始，后面是一个批准的字符，后面跟着行（$）的结尾。

删除^和$，它应该工作！

ng-pattern='/[a-zA-Z_-]/'

第一个测试你的代码在这里：http://rubular.com/

是的，我在另一个RegEx网站上在线测试了它，但是在我的Angular代码中，无论我输入的第二个字符（有效还是不！） –

删除^和$如上所述，它应该工作。您的代码不适用于rubular，但适用于此修补程序。 –

我已经删除了这些字符，它现在允许一切（它只适用于第一个字符） –

如何使用ngPattern验证包含受限字符的输入？

相关推荐