利用angularjs完成注册表单

Posted 2020-09-07 peiyao

ng-init="username = ‘first‘"设置初始显示first字段
ng-class="{‘error‘:signUpForm.username.$invalid && signUpForm.username.$touched}"验证表单是否未通过，touched验证是否有用过
ng-if=‘signUpForm.username.$valid‘输入合法即干。。。
minlength="4" 最小四个字符
maxlength="10" 最大十个字符

ng-submit 只能给form用
ng-disabled 用于将一些东西不可用

 

输入密码与确认密码比较注册了一个compare指令

angular.module(‘myapp‘,[]).directive(‘compare‘,function () {

　　var com ={};
　　// 命令作用于元素和属性中
　　com.strict = "AE" ;
　　com.scope = {
　　　　//之前的这个字符,@对应字符串，=对应数据，&对应函数
　　　　orgText :‘=compare‘
　　}
　　com.require = ‘ngModel‘;
　　/*
　　*scope域，$scope
　　*ele 当前元素
　　*attr属性
　　*control ngModel
　　*v 用户输入值
　　*/
　　com.link = function (scope,ele,attr,control) {
　　　　control.$validators.compare = function(v){
　　　　　　return v ==scope.orgText;
　　　　}
　　　　//与之前的orgText比较
　　　　scope.$watch(‘orgText‘,function(){
　　　　　　//一旦有变化则开始验证
　　　　　　control.$validate();
　　　　})
　　}
　　return com;
})

代码地址：https://github.com/fanpeiyao/angularForm.git