AngularJS验证NG-无效类只提交后(AngularJS validation ng-inva

在我从我有几个验证输入，我需要为ng-invalid类，一旦用户提交表单只适用。

在提交时我可以设置范围为这样的价值...

$scope.submitForm = function () {
    $scope.submited = true;
    // other bits
}

......但我不能弄清楚如何有条件地显示ng-invalid而不改变验证本身。

我运行的角度1.1.5

Answer 1:

演示

 <input type="email" name="email" ng-model="formData.email" required />
<span ng-show="(myForm.email.$dirty || submitted) && myForm.email.$error.required">
  Email is required
</span>

使用$脏标志显示用户只后输入交互的错误：

Answer 2:

<div ng-app>
<div ng-controller="testController">
    <form name="formValidate">
    <input type="text" name="testing" required ng-model="testField" ng-class="{ invalid: submitted && formValidate.testing.$invalid }"/>
        <button ng-click="test()">Test</button>
        </form>
</div>
</div>
<script>
    var app = angular.module('', []);
function testController($scope)
{
    $scope.submitted = false;
    $scope.test= function()
    {
        $scope.submitted = true;    
        console.log($scope.formValidate.$invalid);
    }
}
</script>
<style>
    .invalid
{
    border:1px solid red;   
}
</style>

Answer 3:

对于自定义错误，我建议使用每一个区域内的$ setValidity方法。

$scope.formName.fieldName.$setValidity('custom_error_name', true);

所以你必须在CSS的部分太多的控制，因为这种工作流程也将创造你的领域内的自定义类，如“NG-custom_error_name”这样你就可以面对这一切。

文章来源: AngularJS validation ng-invalid class only after submit