Je viens de commencer à apprendre Angular et j'ai rencontré quelques problèmes de validation de formulaire. Ce que je veux dire, c'est que je veux afficher le message d'erreur lors du flou, mais pas afficher le message d'erreur lors de la mise au point. Mais j'ai suivi le livre que je l'ai tapé, mais. c'est incorrect. Quelqu'un peut-il m'aider à l'analyser ? Merci~
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="../css/lib/bootstrap4.css">
<script type="text/javascript" src='../js/lib/angular.js' ></script>
<script type="text/javascript" src='js/validation2.js'></script>
</head>
<body ng-controller="myCtrl">
<form name='signup_form' novalidate ng-submit='signupForm()'>
<fieldset>
<legend>Signup</legend>
</fieldset>
<fieldset class="form-group">
<label>Your name</label>
<input type="text" class="form-control" placeholder='Name' name='name' ng-model='signup_name' ng-minlength='3' ng-maxlength='20' required ng-focus />
<p class="alert alert-danger" ng-show='signup_form.name.$dirty && signup_form.name.$invalid && !signup_form.name.$focused'>
<small class='error' ng-show='signup_form.name.$error.required'>Your name is required</small>
<small calss='error' ng-show='signup_form.name.$error.minlength'>Your name is required to be at least 3 words</small>
<small class='error' ng-show='signup_form.name.$error.maxlength'>Your name can't be longer than 20 words</small>
</p>
<pre>
focused:{{!signup_form.name.$focused}}
$dirty:{{signup_form.name.$dirty}}<br>
$invalid:{{signup_form.name.$invalid}}<br>
required:{{signup_form.name.$error.required}}<br>
minlength:{{signup_form.name.$error.minlength}}<br>
maxlength:{{signup_form.name.$error.maxlength}}
</pre>
</fieldset>
</form>
</body>
</html>js
var app = angular.module('app',[]);
app.controller('myCtrl', ['$scope','$timeout', function($scope,$timeout){
}])
app.directive('ngFocus',function(){
// var FOCUS_CLASS = "ng-focused";
return{
restrict : 'A',
require : 'ngModel',
link : function(scope,ele,attrs,ctrl){
ctrl.$focused = false;
ele.bind('focus',function(ev){
// ele.addClass(FOCUS_CLASS);
scope.$apply(function(){
ctrl.$focused = true;
});
}).bind('blur',function(ev){
// ele.removeClass(FOCUS_CLASS);
scope.$apply(function(){
ctrl.$focused = false
})
})
}
}
})
Comme +0
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
