$ asyncValidators帶有兩種模式的參數（'新'和'編輯'窗體）

我使用$ asyncValidators來檢查電子郵件是否可用。我只有一種控制器和兩種模式的模板：'新'和'編輯'。我爲此檢查創建了一個指令。但在'編輯'模式下，我不想檢查當前的電子郵件。所以，在我的控制器中，我創建了$ scope.initialEmail來與輸入的電子郵件進行比較。但我不知道如何在指令中使用它（對於編輯模式）。

模板：

<input id="email" name="email" type="email" class="form-control" 
placeholder="{{'placeholders_email'|i18n}}" 
ng-model="user.email" ng-required="true" email-available/> 

<ng-messages for="myForm.email.$error" ng-if="myForm.email.$dirty"> 
<ng-message class="red" when="emailAvailable">{{'email_exists_in_db'|i18n}}</ng-message> 
...

控制器：

//formMode is injected in controller ('new' or 'edit') 
$scope.formMode = angular.copy(formMode); 
$scope.user = {email: '...', ...}; 
switch(formMode){ 
    case 'edit': 
      $scope.initialEmail = angular.copy($scope.user.email); 
      break; 
}

廠：

//AuthHttp is an auth service using $http 
angular.module('myapp').factory('EmailAvailableValidator', ['$q', 'AuthHttp', function($q, AuthHttp) { 
return function(email) {   
    var deferred = $q.defer(); 
    AuthHttp.get('/rest/users/emailAvailable/'+email).then(function() { 
     deferred.resolve(); 
    }, function() { 
     deferred.reject(); 
    }); 
    return deferred.promise; 
}}]);

指令：

angular.module('myapp').directive('emailAvailable', ['EmailAvailableValidator', function(EmailAvailableValidator) { 
    return { 
     restrict: "A", 
     require : 'ngModel', 
     link : function(scope, element, attrs, ngModel) { 
      switch(scope.formMode){ 
       case 'new': 
        ngModel.$asyncValidators.emailAvailable = EmailAvailableValidator; 
        break; 
       case 'edit': 
        ngModel.$asyncValidators.emailAvailable = function(email){ // ? 
         if(!_.isEqual(scope.initialEmail, ngModel.$modelValue)){ // ? 
          return EmailAvailableValidator; // ?? 
         } 
        }; 
        break; 
      } 
     } 
    } 
}]);

來源

2015-06-21 slim

，我怎麼能使用$ asyncValidators與條件？ – slim

異步驗證程序只執行一次。在編輯模式下，我想比較當前值和初始值，當前值可能會在填寫表格時發生變化。 – slim

的解決方案是增加$ q.when的編輯模式是這樣的：

廠：

angular.module('myapp').factory('UsersService', ['AuthHttp', '$q', function (AuthHttp, $q) { 
    return { 

     emailAvailable: function(email){ 
      var deferred = $q.defer(); 
      AuthHttp.get('/rest/users/emailAvailable/'+email).then(function() { 
       deferred.resolve(); 
      }, function() { 
       deferred.reject(); 
      }); 
      return deferred.promise; 
     } 
    } 
}]);

指令：

angular.module('myapp').directive('emailAvailable', ['UsersService', '$q', function(UsersService, $q) { 
    return { 
     restrict: "A", 
     require : 'ngModel', 
     link : function(scope, element, attrs, ngModel) { 
      switch(scope.formMode){ 
       case 'new': 
        ngModel.$asyncValidators.emailAvailable = function(modelValue, viewValue) { 
         return UsersService.emailAvailable(modelValue || viewValue); 
        }; 
        break; 
       case 'edit': 
        ngModel.$asyncValidators.emailAvailable = function(modelValue, viewValue){ 
         var newValue = modelValue || viewValue; 
         var promise; 
         if(!_.isEqual(scope.initialEmail, newValue)){ 
          promise = UsersService.emailAvailable(newValue); 
         } else { 
          promise = $q.when(!_.isEqual(scope.initialEmail, newValue)); 
         } 
         return promise; 
        }; 
        break; 
      } 
     } 
    } 
}]);

換句話說

來源

2015-06-27 10:21:00 slim

$ asyncValidators帶有兩種模式的參數（'新'和'編輯'窗體）

回答

相關問題