2016-04-14 73 views
0

我是新的角度js,我试图在我的登录页面添加一些动画。

我写了一个控制器,它会改变点击和模糊时输入字段的类。

app.controller("con", function($scope,$rootScope,$http,$location){ 
    $scope.OnClick = function(event){ 
     $scope.username1 = "active"; 
     $scope.password1 = "active"; 
     }; 

    $scope.OnBlurUserName = function(event){ 
     if(this.username) 
      $scope.username1 = "active"; 
     else{ 
      $scope.username1 = "input"; 
     } 
     }; 
     $scope.OnBlurPassword = function(event){ 
      if(this.password) 
       $scope.password1 = "active"; 
      else{ 
       $scope.password1 = "input"; 
      } 
      }; 
}); 


     <div class = "input" ng-class="username1" ng-controller="con"> 
     <label class="label">Username</label> 
     <input class="field" name="username" type="text" ng-model="username" 
     ng-click="OnClick()" ng-blur="OnBlurUserName(username)" required> 

     <div class="input" ng-class="password1" ng-controller="con"> 
     <label class="label">Password</label> 
     <input name="password" class="field" type="password" ng- model="password" 
     ng-click="OnClick()" ng-touched="OnClick()" ng-blur="OnBlurPassword(password)" required> 

发生了什么是点击用户名和密码正在改变班级。但是,如果我在用户名中输入某些内容并按下Tab按钮并在密码中输入内容,则该类不会被更改。

我该如何检查用户是否已经开始输入输入并应用我在点击时应用的相同类?

在此先感谢!

回答

0

我通过添加ng-focus和ng-click来修复它。