<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.wrapp{
margin: 30px;
}
.erro{
color:red;
}
.uerro{
border:1px solid red;
}
</style>
<link href="https://cdn.bootcss.com/bootstrap/4.0.0-beta/css/bootstrap.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/angular.js/1.4.0-beta.4/angular-1.4.0-beta.5/angular.js"></script>
</head>
<body ng-app="">
<div class="wrapp">
<form name="signForm" ng-submit="formSubmit()">
<div>
<label>用户名:</label>
<input name="username"
ng-model="un"
type="text"
required
ng-minlength="4"
ng-maxlength="12"
class="form-control"
>
</div>
<!-- <pre>{{ signForm.username }}</pre> -->
<label class="erro" ng-if="signForm.username.$invalid && signForm.username.$touched">
用户名应该在4-12位之间
</label>
<div>
<label>密码:</label>
<input name="password"
ng-model="pw"
type="password"
required
ng-minlength="4"
ng-maxlength="12"
class="form-control"
>
</div>
<pre>{{signForm.password}}</pre>
<label class="erro"
ng-if="signForm.password.$invalid && signForm.password.$touched">
密码应该在4-12位之间
</label>
<div>
<input name="password2"
ng-model="pw2"
type="password2"
required
ng-minlength="4"
ng-maxlength="12"
class="form-control"
>
</div>
<pre>{{signForm.password2}}</pre>
<label class="erro" ng-if="signForm.password2.$modelValue==signForm.password2.modelValue&&signForm.password2.$touched">两次输入的密码不一致
</label>
<div>
<button class="btn" type="submit">提交</button>
</div>
</form>
</div>
</body>
</html>
