$dirty上的角度变化类

angular change class on $dirty

本文关键字：变化 dirty      更新时间：2024-06-17

我是angular 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>

发生的事情是点击用户名和密码，类正在被更改。但是，如果我在用户名中输入了一些内容，然后按下选项卡按钮并在密码中输入一些内容，则类不会被更改。

我如何检查用户是否已开始输入并应用与我单击时应用的类相同的类？

提前感谢！

您可以在输入中使用ng class指令，并根据需要进行调整：

ng-class="{'your-class': yourForm.yourInputsName.$dirty}"

这里有一个很好的答案，如果使用AngularJS更改输入，我如何向输入添加类？

这里还有一篇关于AngularJS表单验证和操作的好文章https://scotch.io/tutorials/angularjs-form-validation

我通过添加ng焦点和ng点击来修复它。

相关文章：