Как использовать ngPattern для проверки ввода, содержащего ограниченные символы?

Question

Я пытаюсь проверить ввод символов с ограничениями. Поле ввода принимает только символы алфавита, тире и подчеркивания.

Когда я тестирую код ниже, первый символ принимается, а второй вызывает ошибку шаблона.

Мой RegEx: /^ [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> 

Этот код находится в угловом Материал Dialog (v1.0.9)

Answer 1

Для более одного символа вам нужно * в конце шаблона, то есть:

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

См скрипку: https://jsfiddle.net/5wa5478c/

Answer 2

При этом это регулярное выражение указывает, что правильный ввод - это начало строки (^), за которой следует один из утвержденных символов, за которым следует конец строки ($).

Удалите^и $, и это должно сработать!

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

Проверьте свой код здесь первым: http://rubular.com/