Проверка формы триггера на ng-click

Question

Я создал Plunker, который отображает простую форму с необходимым полем электронной почты. Проверка выполняется, когда пользователь вводит адрес электронной почты, но есть способ инициировать проверку при нажатии на кнопку. Я не хочу отключать кнопку на основе действительности формы.

Answer 1

Прямо сейчас вы привязываете ng-show к данным, которые меняются всякий раз, когда пользователь вводит их. Вместо этого привяжите его к данным, которые изменяются при нажатии кнопки. Вот мой вопрос:

$scope.update = function(user) { 
    $scope.isEmptyEmail = $scope.form.uEmail.$error.required; 
    $scope.isInvalidEmail = $scope.form.uEmail.$error.email; 
}; 

А затем привяжите ваши данные к этим новым значениям.

<span ng-show="isEmptyEmail">Tell us your email.</span> 
    <span ng-show="isInvalidEmail">This is not a valid email.</span> 

Answer 2

Если я правильно понимаю, у вас есть

в HTML:

ng-click="update(form) 

в Ctrl:

$scope.update = function(form) { 
    //form.uEmail.$error.email 
    //..etc 
    console.log('update'); 
    }; 

и продолжить проверки

Answer 3

Я использую это подход для m yself. До сих пор это, кажется, работает просто отлично

Контроллер:

$scope.update = function() { 
    $('.ng-invalid').addClass('ng-touched'); 
    if ($scope.form.$valid) { 
     /// submit 
    } 
} 

Вид:

<ng-form name='form'> 
    <!-- ... --> 
    <button type="button" ng-click='update()'>Submit</button> 
</ng-form> 

Answer 4

Если это просто форма проверки, аналогичные выше, но немного проще и меньше кода :

<input id="id" type="text" name="inputName" required> 
<span ng-show="isSubmitted && formName.inputName.$error.required">This field is required</span> 
<button id="save" value="Submit" ng-click="formSubmission()">Submit</button> 

и в контроллере:

$scope.formSubmission = function() { 
    $scope.isSubmitted = true; 
} 

Таким образом, он может работать с каждым полем, и вы не должны писать код для каждого требуемого входного