Проверка контроля формы на основе других элементов управления, доступ к другому элементу управления в функции проверки

Я хотел бы подтвердить электронную почту и телефон, основываясь на следующем:

Если оба адреса электронной почты и телефон пусты или значение, содержащее их, недействительны, то оба недействительны с сообщением "Пожалуйста, укажите действительный адрес электронной почты или номер телефона".

Если адрес электронной почты недействителен, он недействителен, возможно, с вышеуказанным сообщением плюс "Это недействительный адрес электронной почты". То же самое касается телефона.

Вот что я получил до сих пор:

Шаблон/html:

      <input type="email" name="email" class="form-control"
        id="useredit:email" 
        data-ng-model="userInfo.email"
        data-user-validate='email'
      >
      <span class="glyphicon form-control-feedback"
            data-ng-class="setValidGlyph(userEdit.email,'mail');"
            data-ng-show='!userEdit.email.$pristine'
            data-tooltip-html-unsafe=
              "{{getValidateMessage(userEdit.email,'email');}}"
            data-tooltip-trigger='click'
            data-tooltip-placement='bottom'
            data-tooltip-append-to-body='true'
            ></span>

setValidGlyph происходит из appSettings и вычисляет, какой символ отображать:

setValidGlyph:function(input,fieldName){
  return {
    'glyphicon-info-sign':input.$error[fieldName] && !input.$pristine
    ,'glyphicon-ok': !input.$error[fieldName] && !input.$pristine
  };
}

getValidateMessage поступает из appRules и будет отображать сообщения (сообщения) в зависимости от того, что функция validator установила true (см. код позже).

data-tooltip - это подсказка для бутстрапа ui.

Директива:

angular.module('app').directive('userValidate'
 , ['appSettings', 'appRules', function(appSettings,appRules) {
  return {
    require: 'ngModel',
    link: function(scope, elm, attrs, ctrl) {
      var fn=appRules.user.validate(attrs.userValidate);
      ctrl.$parsers.unshift(
        function(viewValue){
          fn(viewValue,ctrl);
        }
      );
      ctrl.$error.messages=
        appRules.user.validateMessages[attrs.userValidate];
    }
  };
}]);

apprules:

angular.module('app').factory('appRules'
 , ['appSettings',function(appSettings){
  var appRules = {
    user:{
      validate:function(name){        
        return appRules.user.validateFunctions[name];
      },
      validateFunctions: {
        email:function(viewValue,ctrl){
          //  mail indicates if this box is valid or not used for css
          ctrl.$setValidity('mail'
            , appRules.general.isEmail(viewValue));
          //specific to see if email is valid
          //removed isEmail to make code shorter
          ctrl.$setValidity('invalidEmail'
            , appRules.general.isEmail(viewValue));
        }
      },
      getValidateMessage:function(ctrl,name){
        var ret = [],i=-1,len=ctrl.$error.messages.length;
        while(++i<len){
          if(ctrl.$error[ctrl.$error.messages[i]]){
            ret.push('<p>');
            ret.push(appSettings
              .userFailMessages[ctrl.$error.messages[i]]);
            ret.push('</p>');
          }
        }
        return ret.join('');
      },
      validateMessages: {
        name:['emptyName'],
        email:['invalidEmail','phoneOrEmail']
      }
    }
  };
  return appRules;
}]
);

appSettings.userFailMessages находится в appSettings и выглядит следующим образом:

appSettings.userFailMessages.invalidEmail="Please provide a valid email.";

В appRules.validateFunctions.email Я хотел бы получить доступ к телефону. $pristine и phone. $error, но переданные аргументы являются только текущим элементом управления вводом и не имеют доступа к его форме.

Как я могу получить к нему доступ? Возможно, где-нибудь в шаблоне я могу установить форму с помощью:

{{setForm(userEdit);}}

Где userEdit - это имя формы, а setForm - это метод appRules, но он вроде бы неаккуратный.

Причина проверки и сообщений в правилах и настройках заключается в том, что мне неудобно иметь правила домена и сообщения об ошибках в моем шаблоне.

Ответ 1

Если вам нужен доступ к форме в вашей директиве, вам необходимо ее:

require: ['^form', 'ngModel'],
link: function($scope, elem, attrs, ctrls) {
   var form = ctrls[0];
   var ngModel = ctrls[1];

   if(form) {
     // use form to get whatever it is you care about.
     var whatever = form[otherProperty].$error.something;
   }
}

Итак, учитывая вышеизложенное, вы должны иметь возможность передать контроллер формы в свои собственные методы проверки в качестве третьего аргумента и обрабатывать все, что вам нужно.

Надеюсь, это поможет.