ANGULARJS-仅在提交时验证

Question

我只想对提交进行验证。 现在，我为输入创建了一个指令，用于检查最小值是否为5000，但是我不希望它检查通过按键键入的每个数字。 我只希望它在我点击提交时进行检查。 这是： http : //jsfiddle.net/58b7491d/

HTML

<div ng-app="myAppApp">
  <div ng-controller="MainCtrl">
        <form name="myForm" novalidate ng-submit="submitPlanInfo(myForm.$valid);">
            <div>
                <label for="initInvestment">Number (Min: 5000)</label>
                <input id="initInvestment" name="initInvestment" class="form-control" ng-model="model1.InitInvestment" required min-Value="5000"/>
                <p ng-show="myForm.initInvestment.$invalid && myForm.initInvestment.$dirty && myForm.$submitted" class="validation">Min Value should be 5000</p>

            </div>
            <div>
                <button type="submit" name="submit">Submit</button>
            </div>
        </form>
    </div>
</div>

JAVASCRIPT

angular.module('myAppApp', [])
.directive('minValue', function () {
    return {
        require: "ngModel",
        restrict: 'A',
        link: function postLink(scope, element, attrs, ngModel) {

            ngModel.$validators.minValueErrMsg = function (value) {
                var status = true;
                console.log(value);
                if (value < attrs.minValue) {
                    status = false;
                }
                return status;
            };
        }
    };
})
.controller('MainCtrl', function ($scope, $controller) {
    //LETS DO THE FORM VALIDATION AFTER HITTING SUBMIT!!
    $scope.submitPlanInfo = function (isValid) {
        console.log($scope.myForm);
        if ($scope.myForm.$valid) {
            console.log($scope.myForm.initInvestment);
           // console.log(angular.isNumber(parseInt($scope.myForm.initInvestment.$modelValue)));
            var minVal = parseInt($scope.myForm.initInvestment.$modelValue);
           // console.log(angular.isNumber(minVal));
            if (minVal < 5000){
                console.log("should be min 5000");
                return false;
            }else{
                console.log("success");
                return true;
            }
            alert("Valid");
        }

    };
    //END OF FORM VALIDATION
});

Answer 1

提交后的IMO验证不是一个很好的UX。 我会尝试使用ng-messages指令以及设置ng-model-options来在blur上更新。

考虑阅读有关Moo的有关此内容的年份

他深入探讨了同步和异步验证器，以及有关ng-model-options一小部分。

角度文档-ngModelOptions

角度文档-ngMessages