AngularJS |使用ng模糊和条件变量验证电子邮件的唯一性

在用户提交表单之前，我使用ng blur确认电子邮件地址的唯一性。我希望下面的代码仅在执行

$http.put

并接收409（我确认正在发送）时显示“已接收电子邮件地址”。在所有其他情况下，emailIsAvailable变量应保持为true，并且我不应看到“该电子邮件地址已被占用”。不幸的是，错误显示API是发送409还是200

HTML:

<div class="form-group" ng-class="{'has-error' : signup.email.$invalid && signup.email.$dirty}">

      <div>
        <input type="text" name="email" class="form-control" placeholder="Email" ng-model="signupForm.email" ng-blur="validateEmail()" required>
        <span class="help-block has-error" ng-if="signup.email.$dirty">
          <span ng-show="signup.email.$error.required">Email address is required.</span>
          <span ng-show="signup.email.$error.email">Not a valid email address.</span>
          <span ng-hide="emailIsAvailable">That email address is taken.</span>
        </span>
      </div>
    </div>

  $scope.emailIsAvailable = true;

  $scope.validateEmail = function() {

    var email = $scope.signupForm.email;

    console.log(email);

    if (email === undefined) {
      return;
    } else if (AuthService.validateEmail(email) === true) {
      $scope.emailIsAvailable = true;
      return;
    } else {
      $scope.emailIsAvailable = false;
      return;
    }
  };

validateEmail: function (email) {
  return $http.put('/api/user/validateEmail', {
    email : email
  })
  .then(function onSuccess (res) {
    return true;
  })
  .catch(function (res) {
    return false;
  });
}

服务：

<div class="form-group" ng-class="{'has-error' : signup.email.$invalid && signup.email.$dirty}">

      <div>
        <input type="text" name="email" class="form-control" placeholder="Email" ng-model="signupForm.email" ng-blur="validateEmail()" required>
        <span class="help-block has-error" ng-if="signup.email.$dirty">
          <span ng-show="signup.email.$error.required">Email address is required.</span>
          <span ng-show="signup.email.$error.email">Not a valid email address.</span>
          <span ng-hide="emailIsAvailable">That email address is taken.</span>
        </span>
      </div>
    </div>

  $scope.emailIsAvailable = true;

  $scope.validateEmail = function() {

    var email = $scope.signupForm.email;

    console.log(email);

    if (email === undefined) {
      return;
    } else if (AuthService.validateEmail(email) === true) {
      $scope.emailIsAvailable = true;
      return;
    } else {
      $scope.emailIsAvailable = false;
      return;
    }
  };

validateEmail: function (email) {
  return $http.put('/api/user/validateEmail', {
    email : email
  })
  .then(function onSuccess (res) {
    return true;
  })
  .catch(function (res) {
    return false;
  });
}

---

AuthService.validateEmail

函数返回一个承诺

你需要重构你如何称呼它

$scope.emailIsAvailable = true;

$scope.validateEmail = function() {
  var email = $scope.signupForm.email;

  console.log(email);

  if (email === undefined) {
    return;
  } else {
    AuthService.validateEmail(email)
    .then(function onSuccess (res) {
      $scope.emailIsAvailable = true;
    })
    .catch(function (res) {
      $scope.emailIsAvailable = false;
    });
  }
};

---

AuthService.validateEmail

函数返回一个承诺

你需要重构你如何称呼它

$scope.emailIsAvailable = true;

$scope.validateEmail = function() {
  var email = $scope.signupForm.email;

  console.log(email);

  if (email === undefined) {
    return;
  } else {
    AuthService.validateEmail(email)
    .then(function onSuccess (res) {
      $scope.emailIsAvailable = true;
    })
    .catch(function (res) {
      $scope.emailIsAvailable = false;
    });
  }
};

谢谢：）我没有意识到承诺必须一路返回。谢谢：）我没有意识到承诺必须一路返回。