javascript - 添加 "submit()"时 ng-show/ng-hide 循环，导致浏览器崩溃

Question

我正在尝试使用 ng-show 或 ng-hide 添加错误消息。

<p ng-show="submit()">Incorrect login/password.</p>

<form method="POST" name="adminform" ng-submit="submit()" class="admin-login-form">

    <label for="username">Admin Login</label>
    <input ng-model="username" type="text" name="username" class="form-control" required autofocus="yes"/>

    <label for="password">Password</label>
    <input ng-model="password" type="password" name="password" class="form-control" required />

    <input type="submit" class="form-control" name="submit" value="Login" required/>

</form>

理想情况下，当运行submit()并且登录失败时需要激活显示/隐藏。但是，当我执行 ng-show="submit()"时，它可以工作，但会不断刷新自身并循环，使浏览器崩溃并在控制台中给出错误，即使提交按钮本身尚未被单击。

$scope.submit = function() {
                  var data = {
                      'username': $scope.username,
                      'password': $scope.password
                  };

                  var hookphp = loginService.login();

                  hookphp.save(data,
                      function(result){
                          $location.path("dashboard");
                      },

                      function(){
                          alert('Invalid password/login.');

                      }
                  );
              };

此外，当登录不成功时，它永远不会向我发出警报。有人能建议如何正确地做到这一点吗？我仍在弄清楚 Javascript 和 Angular 是如何工作的。非常感谢!

Answer 1

<p ng-show="errorVisible">Incorrect login/password.</p>

Angular

$scope.errorVisible = true/false (set it whenever you need it)

所以:

$scope.errorVisible = false;
$scope.submit = function() {
              var data = {
                  'username': $scope.username,
                  'password': $scope.password
              };

              var hookphp = loginService.login();

              hookphp.save(data,
                  function(result){
                      $location.path("dashboard");
                      $scope.errorVisible = false; //optional
                  },
                  function(){
                      $scope.errorVisible = true;
                  }
              );
          };

它在初始代码中永远循环的原因是 ng-show 不断调用该函数，但该函数不返回任何内容。