Angular условная проверка электронной почты

Как я могу условно использовать проверку электронной почты angular на основе наличия другой переменной области видимости? Я просмотрел документацию, но единственный способ активировать проверку электронной почты, который я могу найти, — это использовать input type="email", который в данном случае я не могу использовать из-за зависимости другой директивы от type="text".

В идеале я хотел бы либо назначить ng-match="email" на основе значения другой переменной области видимости, либо просто проверить электронную почту программно при отправке. Теоретически я мог бы просто использовать отдельное регулярное выражение для проверки электронной почты, но, если возможно, я хотел бы использовать проверку Angular, поскольку я использую ее везде.

Спасибо

-- Редактировать: Чтобы уточнить, я специально хотел бы использовать встроенную проверку электронной почты angular в любом решении, которое я в конечном итоге использую.


angularjs email-validation
person jraede    schedule 26.01.2014    source источник
comment
Просто напишите специальную директиву для этого   -  person Mik378    schedule 27.01.2014
comment
Да, я знаю, что могу это сделать, но как я могу использовать встроенную проверку электронной почты angular в этой директиве, если я пойду по этому пути?   -  person jraede    schedule 27.01.2014
comment
Вы можете установить более высокий приоритет для своей директивы, чем для электронной почты (при условии, что вы обрабатываете свой процесс в функции связывания вашей директивы). Чтобы проверка электронной почты происходила ДО процесса вашей пользовательской директивы.   -  person Mik378    schedule 27.01.2014
comment
Хорошо, но я хочу, чтобы проверка электронной почты происходила только время от времени. Если это произойдет до того, как моя директива не будет выполняться все время? Или вы хотите использовать вторую директиву, чтобы переопределить настройку $invalid, которую поле получит, если это не электронная почта?   -  person jraede    schedule 27.01.2014
comment
Зачем вам неидемпотентное поведение? Конечно, он будет выполняться все время.   -  person Mik378    schedule 27.01.2014
comment
Если вы хотите, чтобы поведение строго основывалось на ваших надлежащих условиях, введите свой ввод как type="text" и просто внедрите регулярное выражение в свою директиву, чтобы имитировать его в электронном письме.   -  person Mik378    schedule 27.01.2014
comment
Я просто не считаю правильным использовать две разные версии проверки электронной почты, если мне это не нужно. Но из ответов кажется, что нет возможности использовать встроенную проверку электронной почты Angular где-либо еще за пределами input type="email".   -  person jraede    schedule 27.01.2014

Ответы (2)


arrow_upward
2
arrow_downward

Вы должны использовать ng-required и ng-pattern в поле ввода электронной почты.

<input type="text" ng-model="email" ng-required="emailRequired" ng-pattern="emailPattern" />

А затем определите emailPattern как функцию на $scope вашего контроллера.

$scope.emailPattern = (function() {
var regexp = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return {
    test: function(value) {
        if( $scope.emailRequired === false ) return true;
        else return regexp.test(value);
    }
};

})();

Следующая скрипка реализует то, что вы хотите:

http://jsfiddle.net/9SSE4/

person Tome Pejoski    schedule 26.01.2014
comment
Верно, но нельзя использовать регулярное выражение angular без его явного копирования? - person jraede; 27.01.2014
comment
Нет, потому что проверка электронной почты с помощью регулярных выражений angular работает только с вводом type=email. - person Tome Pejoski; 27.01.2014
comment
Вы можете попробовать сами прямо на примере документации angular. Здесь: jsfiddle.net/5uW2U - person Tome Pejoski; 27.01.2014
comment
Хорошо, но мой вопрос заключался в том, как я могу условно использовать проверку электронной почты angular, а не другую проверку электронной почты. Но из того, что вы говорите, похоже, что я не могу использовать его таким образом. - person jraede; 27.01.2014

arrow_upward
0
arrow_downward

Не могли бы вы изменить тип ввода? Если ввод должен быть проверен как электронное письмо, установите его тип на электронное письмо, иначе установите его как текст.

<input type="{{vm.type}}" ng-model="vm.text" />
<select ng-model="vm.type">
  <option>text</option>
  <option>email</option>

Пример плунжера

person chris    schedule 03.07.2015