我需要创建一个验证指令,以自动显示每个输入的所有输入错误.
此验证指令应显示当前所有错误,并在用户输入时自动更新错误列表.

如果输入是脏的,我需要显示输入的所有错误,而不是空且无效.我需要将所有错误添加到该输入元素附近的html元素中.

例如,如果输入有type =“email”和ng-minlength =“5”,用户键入“abc”,我需要在此输入附近显示此类错误：“无效的电子邮件;请输入至少5个字符;’

例如,如果input具有type =“number”attr和min =“200”,min-model =“minnumber”,并且minnumber模型设置为“300”,用户键入“100”,则需要在此输入附近显示此类错误：请输入最少500个;应该大于Min Number;

另外,如果更新相关模型(min-model param),我还需要更新上一个示例中所有输入的错误消息.

@H_403_11@var app = angular.module('app',[]); app.controller('appCtrl',function ($scope) { }); app.directive('validate',function () { return { restrict: 'A',require: 'ngModel',// require: '^form',link: function (scope,element,attrs,ctrl) { console.log('======================'); console.log(scope); console.log(element); console.log(attrs); console.log(ctrl); console.log(scope.form.$error); angular.forEach(scope.form.$error,function (value,key) { console.log('scope.form.$error = ' + key + ': ' + value); console.log(value); }); } }; }); app.directive('positiveInteger',ctrl) { ctrl.$parsers.unshift(function (viewValue) { var INTEGER_REGEXP = /^\d+$/; if (INTEGER_REGEXP.test(viewValue)) { // it is valid ctrl.$setValidity('positiveInteger',true); return viewValue; } else { // it is invalid,return undefined (no model update) ctrl.$setValidity('positiveInteger',false); return undefined; } }); } }; }); app.directive('positiveFloat',ctrl) { ctrl.$parsers.unshift(function (viewValue) { var FLOAT_REGEXP = /^(?:[1-9]\d*|0)?(?:\.\d+)?$/; if (FLOAT_REGEXP.test(viewValue)) { // it is valid ctrl.$setValidity('positiveInteger',false); return undefined; } }); } }; }); app.directive('minModel',ctrl) { ctrl.$parsers.unshift(function (viewValue) { if (viewValue > scope[attrs.minModel]) { // it is valid ctrl.$setValidity('minModel',return undefined (no model update) ctrl.$setValidity('minModel',false); return undefined; } }); } }; });

你能帮助做出这个验证指令吗？

或者你可以指出我正确的方向吗？

Link to JSFiddle with some code for testing.

附：类似于UI-Utils,但是它们的指令不能在一个地方设置类似的错误消息.