发表于: 2017-06-04 21:52:06
1 1097
今日所做:
准备小课堂:
1.ng-blur 指令用于告诉 AngularJS HTML 元素在失去焦点时需要执行的表达式。
AngularJS 中的 ng-blur 指令不会覆盖原生的 onblur 事件, 如果触发该事件,
ng-blur 表达式与原生的 onblur 事件都会执行。
2.ng-change 指令用于告诉 AngularJS 在 HTML 元素值改变时需要执行的操作。
ng-change 指令需要搭配ng-model指令使用。
AngularJS ng-change 指令指令不会覆盖原生的 onchange 事件, 如果触发该
事件,ng-change 表达式与原生的 onchange 事件都会执行。
3.ng-disabled 指令设置表单输入字段的 disabled 属性(input, select, 或 textarea)。
如果 ng-disabled
中的表达式返回 true 则表单字段将被禁用。
4.做个demo将前面知识实际使用一下:
<input type="text"
ng-model="input"
ng-blur="inputCheck()"
ng-change="minCheck()"
>
<div ng-hide="var1">*此项为必填项</div>
<div ng-hide="var2">*至少输入5位用户名</div>
app.controller('check',function($scope){
$scope.blur=false;
$scope.focus=false;
$scope.var1=true;
$scope.var2=true;
$scope.input="";
$scope.inputCheck=function(){
if($scope.input==""){
$scope.var1=false;
$scope.var2=true;
}else{
$scope.var1=true;
}
console.log($scope.input);
console.log($scope.var);
console.log($scope.input.length);
}
$scope.minCheck=function(){
if($scope.input.length>0){
$scope.var1=true;
}
if($scope.input.length<5){
$scope.var2=false;
}else{
$scope.var2=true;
}
}
明日计划:
做小课堂
做任务8
评论