angulary4
标签指令: 主要用在表单验证当中
标签指令{{myColor.name}}
标签指令 // 有默认的行为
angularJs的表单验证
$valid 是否有效,有效true
$invalid 无效为true
$pristine 是否是初始值,是的话为true
$dirty 是否修改了初始值就,修改过就为true
$error 验证失败或者通过的时候的所有验证信息
注意:
通过 name 的方式进行查找输入框
必须配合ng-model来使用
一般h5的所有type都是支持的
type [ email number url ....]
required
ng-minlength
ng-maxlength
ng-pattern
class 这些css可以根据实际项目添加合适的样式
.ng-valid{}
.ng-invalid{}
.ng-pristine{}
.ng-dirty{}
实例
实战中的表单验证方式
$scope.regText = {
regVal : 'default',
regList : [
{ name : 'default' , tips : '请输入用户名'},
{ name : 'required' , tips : '用户名不能为空'},
{ name : 'pattern' , tips : '用户名必须是字母不能是数字'},
{ name : 'maxlength' , tips : '用户名最多不能超过8个字节'},
{ name : 'pass' , tips : '√'}
]
};
$scope.regPassword = {
regVal : 'default',
regList : [
{ name : 'default' , tips : '请输入密码'},
{ name : 'required' , tips : '密码不能为空'},
{ name : 'minlength' , tips : '密码至少6位'},
{ name : 'pass' , tips : '√'}
]
};
$scope.change = function(res,arg){
//required=true, pattern=false 有一个便不成立
for(var attr in arg){ // attr = required
if(arg[attr] == true){
$scope[res].regVal = attr;
return;
}
}
$scope[res].regVal = 'pass';
}
$scope.sub = function(){
}
}]);
angularJs的自定义指令
angular.module
controller
run
filter
directive 名字只要是驼峰的形式的话,那么开头是my-app形式的
restrict的四种定义方式 指定指令的类型 ng-name/重新html一些标签a input form /属性指令
E:标签指令
A:属性指令
C:class //少用
M:注释 //少用
AECM:即是属性,又是方法
注释写法: 后面有空格.要写replace,希望模板替换注释
replace:true 模板替换标签 //模板可替换,将原来的标签替换掉. 注释只能在替换的时候起作用
template 配置选项添加功能; 模板代码
templateUrl :自定义的模板代码比较多的情况下,写比较不方便。指定的是一个外部模板的页面
tip:字符串拼接可以在后面加上:‘\’;
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
