如何使用 ngPattern 验证包含受限字符的输入?
How to use ngPattern to validate an input containing restricted characters?
我尝试验证受限字符的输入。输入字段只接受字母、破折号和下划线字符。
当我测试下面的代码时,第一个字符被接受,但第二个字符引发模式错误。
我的正则表达式:/^[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>
此代码位于 Angular Material 对话框 (v1.0.9)
有了这个,这个正则表达式表示有效输入是一行的开头 (^),后跟一个被批准的字符,然后是行尾 ($)。
删除 ^ 和 $,它应该可以工作!
ng-pattern='/[a-zA-Z_-]/'
先在此处测试您的代码:http://rubular.com/
对于多个字符,您需要在模式末尾添加 *
,即:
<input ... ng-pattern="/^[a-zA-Z_-]*$/" />
<!-- ^ -->
<!-- | -->
<!-- HERE -------------+ -->
参见fiddle:https://jsfiddle.net/5wa5478c/
我尝试验证受限字符的输入。输入字段只接受字母、破折号和下划线字符。
当我测试下面的代码时,第一个字符被接受,但第二个字符引发模式错误。
我的正则表达式:/^[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>
此代码位于 Angular Material 对话框 (v1.0.9)
有了这个,这个正则表达式表示有效输入是一行的开头 (^),后跟一个被批准的字符,然后是行尾 ($)。
删除 ^ 和 $,它应该可以工作!
ng-pattern='/[a-zA-Z_-]/'
先在此处测试您的代码:http://rubular.com/
对于多个字符,您需要在模式末尾添加 *
,即:
<input ... ng-pattern="/^[a-zA-Z_-]*$/" />
<!-- ^ -->
<!-- | -->
<!-- HERE -------------+ -->
参见fiddle:https://jsfiddle.net/5wa5478c/