Как отключить отправку кнопки, если адрес электронной почты уже завершен с помощью angularjs

Question

Я хочу отключить кнопку отправки, если адрес электронной почты уже выходит из базы данных с помощью угловых символов. но я не знаю, как сделать так

вот мой HTML код

<div data-ng-cloak data-ng-app="AddEmailModule" data-ng-controller="AddEmailController"> 
    <form class="form-horizontal" role="form" id="AddEmailForm" name="AddEmailForm" autocomplete="off" enctype="multipart/form-data" novalidate="" data-ng-submit="AddEmailData(AddEmail)"> 
     <div class="col-sm-6"> 
      <label for="emailid">Email-Id</label> 
      <input type="email" class="form-control" placeholder="Email-Id" id="emailid" name="emailid" pattern="^[a-zA-Z0-9-\_.]+@[a-zA-Z0-9-\_.]+\.[a-zA-Z0-9.]{2,5}$" required ng-change="check_email(emailid)" data-ng-model="AddEmail.emailid">      
      <div class="error" data-ng-show="AddEmailForm.emailid.$dirty && AddEmailForm.emailid.$invalid"> 
       <small class="error" data-ng-show="AddEmailForm.emailid.$error.required">Email-Id is required.</small> 
       <small class="error" data-ng-show="AddEmailForm.emailid.$error.email">Invalid Email-Id.</small> 
      </div>           
      <p><strong class="error">{{getEmail}}</strong></p> 
     </div> 
     <button type="submit" class="btn btn-theme" data-ng-disabled="AddEmailForm.$invalid">Add</button> 
    </form> 
</div> 

в коде выше кнопка отправки по умолчанию отключена его позволит заполняется только EMAILID. но я хочу отключить кнопку, если идентификатор электронной почты уже является базой данных.

Вот мой код AngualarJS.

var AddEmail = angular.module("AddEmailModule", []) 
AddEmail.controller("AddEmailController", function ($scope, $timeout, $http, jsonFilter) 
{ 
    var logResult = function (data, status, headers, config) 
    { 
     return data; 
    }; 

    $scope.check_email = function(emailid) 
    { 
     $http.post('check-email.php', { 'emailid': $scope.AddEmail.emailid }) 
     .success(function (data, status, headers, config) 
     { 
      $scope.getEmail = logResult(data, status, headers, config); 
     }); 
    }; 

    $scope.AddEmailData = function (AddEmail) 
    { 
     //Add code comes here 
    }; 
}); 

регистрация email.php показывает Ok если EMAILID доступен и Email-Id уже существует если EMAILID уже выходит. Теперь я немного смущен, как отключить кнопку отправки на основе этих сообщений?

Любая помощь/предложение?

Answer 1

создать логическую переменную, и если адрес электронной почты уже существует сделать переменную истинным

var AddEmail = angular.module("AddEmailModule", []) 
AddEmail.controller("AddEmailController", function($scope, $timeout, $http, jsonFilter) { 

    $scope.emailExist = false; 

    var logResult = function(data, status, headers, config) { 
     return data; 
    }; 
    $scope.check_email = function(emailid) { 
     $scope.emailExist = false; 
     $http.post('check-email.php', { 
       'emailid': $scope.AddEmail.emailid 
      }) 
      .success(function(data, status, headers, config) { 
       $scope.getEmail = logResult(data, status, headers, config); 
       $scope.emailExist = true; // make this true if email exist 
      }); 
    }; 
    $scope.AddEmailData = function(AddEmail) { 
     //Add code comes here 
    }; 
}); 

В ng-disabled использование нескольких условий

<button type="submit" class="btn btn-theme" data-ng-disabled="AddEmailForm.$invalid || emailExist">Add</button> 

EDITED

замените check_email функцию с этим

$scope.check_email = function(emailid) 
    { 
     $scope.emailExist = false; 
     $http({ 
      url :'http://localhost:8080/app/check-email.php', 
      method : 'POST', 
      data : { 
      'emailid': $scope.AddEmail.emailid 

      } 
     }).then(function(response){ 
      $scope.getEmail = logResult(response.data); 
      if(response.data=="Email-Id already exists") 
      { 
       $scope.emailExist = true; 
      } 
     },function(response){ 
      $scope.emailExist = false; 
     }) 
    }; 

причина я использую then является success удаляется из угловой версии 1.6.1 в PHP файл, который вы не возвращает «OK» его возвращение «Email-Id уже существует», так что использовать для если условие

Answer 2

Observbvation: Передайте правильное значение модели внутри функции изменения ng.

ng-change="check_email(emailid)" должен быть ng-change="check_email(AddEmail.emailid)"

DEMO

var myApp = angular.module('myApp',[]); 
 

 
myApp.controller('MyCtrl',function($scope) { 
 
    $scope.emailExist = true; 
 
    $scope.alreadyRegMail = 'test@gmail.com'; 
 
    $scope.check_email = function(emailid) { 
 
     if(emailid == $scope.alreadyRegMail) { 
 
     $scope.emailExist = true; 
 
     } else { 
 
     $scope.emailExist = false; 
 
     } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
     <form class="form-horizontal" role="form" id="AddEmailForm" name="AddEmailForm" autocomplete="off" enctype="multipart/form-data" novalidate="" data-ng-submit="AddEmailData(AddEmail)"> 
 
     <div class="col-sm-6"> 
 
      <label for="emailid">Email-Id</label> 
 
      <input type="email" class="form-control" placeholder="Email-Id" id="emailid" name="emailid" pattern="^[a-zA-Z0-9-\_.]+@[a-zA-Z0-9-\_.]+\.[a-zA-Z0-9.]{2,5}$" required ng-change="check_email(AddEmail.emailid)" data-ng-model="AddEmail.emailid">      
 
      <div class="error" data-ng-show="AddEmailForm.emailid.$dirty && AddEmailForm.emailid.$invalid"> 
 
       <small class="error" data-ng-show="AddEmailForm.emailid.$error.required">Email-Id is required.</small> 
 
       <small class="error" data-ng-show="AddEmailForm.emailid.$error.email">Invalid Email-Id.</small> 
 
      </div> 
 
     </div> 
 
     <button type="submit" class="btn btn-theme" data-ng-disabled="AddEmailForm.$invalid || emailExist">Add</button> 
 
    </form> 
 
</div>