2015-11-19 2 views
1

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

мой код следующий

<input type="text" name="textInput" data-ng-model="field.data" class="form-control" required/> 
<span ng-show="form.textInput.$dirty && form.textInput.$error.required">Required!</span> 

ответ

2

Попробуйте следующее

<span ng-show="form.textInput.$touched && form.textInput.$error.required">Required!</span> 

Это покажет сообщение после того, как вы коснулись и влево (потерял фокус) с недопустимым полем. Documentation

1

Да, это выполнимо. Сначала добавьте директиву, как это:

myApp.directive('trackFocus', ['$timeout', function($timeout) { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     scope: true, 
     link: function ($scope, element, attr, ctrl) { 
      element.on("focus", function() { 
       $timeout(function() { 
        ctrl.hasFocus = true; 
       }); 
      }); 

      element.on("blur", function() { 
       $timeout(function() { 
        ctrl.hasFocus = false; 
       }); 
      }); 
     } 
    } 
}]); 

Затем используйте директиву и изменить код:

<input type="text" name="textInput" ng-model="field.data" class="form-control" required track-focus /> 

<span ng-show="form.textInput.hasFocus && form.textInput.$dirty && form.textInput.$error.required">Required!</span>