发表于: 2017-06-04 21:52:06

1 1096



今日所做:
准备小课堂:
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


返回列表 返回列表
评论

    分享到